fix: useModel

田强
1 parent 342d2a1b
Showing 1 changed file with 315 additions and 104 deletions
src/pages/list-view/index.tsx
--- a/src/pages/list-view/index.tsx
View file @3e417ca
+++ b/src/pages/list-view/index.tsx
View file @3e417ca
@@ -6,7 +6,7 @@ import React, {
   useState,
 } from 'react';
 import { history, useLocation, useParams } from 'umi';
-import { useModel } from '@@/plugin-model/useModel';
+import { useModel } from 'umi';
 import { EyeInvisibleOutlined, RedoOutlined } from '@ant-design/icons';
 import { Alert, Button, Empty, message, Modal, Result, Spin, Tabs } from 'antd';
 import _, { isFunction } from 'lodash';
@@ -124,29 +124,39 @@ type ListViewCoreProps = {
   relQuery?: any;
   selectKeys?: string[];
   onSelect?: (record: any, selected: boolean, _selectedRows?: any[]) => void;
-  onSelectAll?: (selected: boolean, selectedRows: any[], changeRows: any[]) => void;
+  onSelectAll?: (
+    selected: boolean,
+    selectedRows: any[],
+    changeRows: any[],
+  ) => void;
   initSelectedIds?: string[];
 };
 const getRows = (columns: any[]) => {
   let rows = 1;
-  const _columns = columns.filter(item => (item.key || item.dataIndex).indexOf('_merge_field') === 0);
-  _columns.forEach(item => {
+  const _columns = columns.filter(
+    (item) => (item.key || item.dataIndex).indexOf('_merge_field') === 0,
+  );
+  _columns.forEach((item) => {
     if (item.children?.length) {
       if (rows === 1) rows = 2;
       item.children.forEach((it: any) => {
-        if ((it.key || it.dataIndex).indexOf('_merge_field') === 0 && it.children?.length) {
+        if (
+          (it.key || it.dataIndex).indexOf('_merge_field') === 0 &&
+          it.children?.length
+        ) {
           rows = 3;
         }
-      })
+      });
     }
-  })
-  return rows
-}
+  });
+  return rows;
+};
 const useTableScrollY = (deps: any[]) => {
   const size = deps?.[0]?.size;
-  const itemHeaderHeight = size === 'middle' ? 48 : size === 'default' ? 56 : 40;
+  const itemHeaderHeight =
+    size === 'middle' ? 48 : size === 'default' ? 56 : 40;
   const headerRows = getRows(deps?.[0]?.columns || []);
   const TABLE_VIEW_LIST = 'qx-view-list';
   const PAGINATION_HEIGHT_CLASS_NAME = 'ant-pagination';
@@ -157,9 +167,13 @@ const useTableScrollY = (deps: any[]) => {
   const tableViewListDefaultHeight = 400;
   const defaultPagePadding = 10;
-  const $ = (selectors: string) => document.querySelector<HTMLElement>(selectors);
+  const $ = (selectors: string) =>
+    document.querySelector<HTMLElement>(selectors);
-  const defaultScrollY = useMemo(() => document.body.clientHeight, [tableHeader]);
+  const defaultScrollY = useMemo(
+    () => document.body.clientHeight,
+    [tableHeader],
+  );
   const [scrollY, setScrollY] = useState<number>(defaultScrollY ?? 200);
@@ -172,13 +186,16 @@ const useTableScrollY = (deps: any[]) => {
     const toolbar = $(`.${TOOLBAR_NAME}`);
-    const tableViewListClientHeight = tableViewList?.clientHeight || tableViewListDefaultHeight;
+    const tableViewListClientHeight =
+      tableViewList?.clientHeight || tableViewListDefaultHeight;
     const toolBarHeight = (toolbar?.clientHeight ?? 0) + 20;
     const antPaginationHeight =
       (antPagination?.clientHeight ?? paginationDefaultHeight) +
-      (antPagination ? parseInt(getComputedStyle(antPagination).margin) : paginationDefaultMargin);
+      (antPagination
+        ? parseInt(getComputedStyle(antPagination).margin)
+        : paginationDefaultMargin);
     const result =
       tableViewListClientHeight -
@@ -207,7 +224,9 @@ const useTableScrollY = (deps: any[]) => {
     const header = $('.ant-pro-top-nav-header');
     const appViewCont = $('.app-view-cont');
     if (appViewCont) {
-      const headerHeight = header ? window.getComputedStyle(header).height : '0';
+      const headerHeight = header
+        ? window.getComputedStyle(header).height
+        : '0';
       const appViewContOffsetTop = appViewCont?.offsetTop ?? 0;
       const height = `calc(100vh - ${
         parseInt(headerHeight) + appViewContOffsetTop + defaultPagePadding
@@ -340,7 +359,12 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
   const [filterTreeData, setFilterTreeData] = useState<any>();
   const [charts, setCharts] = useState<any[]>([]);
   const [sorter, setSorter] = useState<any>([]);
-  const [scrollY] = useTableScrollY([listProps, charts, isFullscreen, searchFoldState]) as any[];
+  const [scrollY] = useTableScrollY([
+    listProps,
+    charts,
+    isFullscreen,
+    searchFoldState,
+  ]) as any[];
   const [modelId, setModelId] = useState<string>('');
   const [dataset, setDataset] = useState<boolean>(false);
   const [relationTag, setRelationTag] = useState<any>();
@@ -392,11 +416,13 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           setSearchSchema(null);
         }
         setOptBar(el.bar);
-        (el.funList?.columns || []).forEach((item: { type: string; className?: string }) => {
-          if (item.type === 'FILE') {
-            item.className = 'qx-custom-file';
-          }
-        });
+        (el.funList?.columns || []).forEach(
+          (item: { type: string; className?: string }) => {
+            if (item.type === 'FILE') {
+              item.className = 'qx-custom-file';
+            }
+          },
+        );
         setListProps(el.funList);
         setSelectMode(el.searchMode || '');
       }
@@ -416,7 +442,14 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
     qsIndex?: number;
   }) {
     //重置后需要保留的字段
-    const FIXED_FIELDS = ['_code', 'appId', 'pageSize', 'viewCode', 'viewType', '_filter'];
+    const FIXED_FIELDS = [
+      '_code',
+      'appId',
+      'pageSize',
+      'viewCode',
+      'viewType',
+      '_filter',
+    ];
     if (!query) {
       return;
     }
@@ -453,7 +486,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
               };
             }
             oldStyle.enableTitle = false;
-            oldStyle.dataLabelWeight = !!item?.factor ? parseInt(item?.factor) : 0;
+            oldStyle.dataLabelWeight = !!item?.factor
+              ? parseInt(item?.factor)
+              : 0;
             if (!!item?.unit) {
               oldStyle.dataLabelSuffix = {
                 unit: item?.unit,
@@ -480,20 +515,27 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
               Object.values(res?.[index]?.result?.[1] || {})?.[0] === 0
                 ? Object.values(res?.[index]?.result?.[1] || {})?.[0]
                 : '';
-            if (_.isEmpty(res[index]?.result) || (!item.metricsData && item.metricsData !== 0)) {
+            if (
+              _.isEmpty(res[index]?.result) ||
+              (!item.metricsData && item.metricsData !== 0)
+            ) {
               item.noneData = true;
             } else {
               item.noneData = false;
             }
           } else if (_widget === 'PIE') {
             _options = transferSpecialEchartsJson(
-              res[index]?.result && Array.isArray(res[index]?.result) ? res[index]?.result : [],
+              res[index]?.result && Array.isArray(res[index]?.result)
+                ? res[index]?.result
+                : [],
               { card: item.cardConfig },
               [],
               'totals',
             );
             _fullOptions = transferSpecialEchartsJson(
-              res[index]?.result && Array.isArray(res[index]?.result) ? res[index]?.result : [],
+              res[index]?.result && Array.isArray(res[index]?.result)
+                ? res[index]?.result
+                : [],
               { card: item.cardConfig },
               [],
             );
@@ -509,13 +551,17 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
             }
           } else {
             _options = transferEchartsJson(
-              res[index]?.result && Array.isArray(res[index]?.result) ? res[index]?.result : [],
+              res[index]?.result && Array.isArray(res[index]?.result)
+                ? res[index]?.result
+                : [],
               { card: item.cardConfig },
               res[index]?.groups || [],
               'totals',
             );
             _fullOptions = transferEchartsJson(
-              res[index]?.result && Array.isArray(res[index]?.result) ? res[index]?.result : [],
+              res[index]?.result && Array.isArray(res[index]?.result)
+                ? res[index]?.result
+                : [],
               { card: item.cardConfig },
               res[index]?.groups || [],
             );
@@ -531,7 +577,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
             }
           }
           item.chartResult =
-            res[index]?.result && Array.isArray(res[index]?.result) ? res[index]?.result : [];
+            res[index]?.result && Array.isArray(res[index]?.result)
+              ? res[index]?.result
+              : [];
           item.options = _.cloneDeep(_options);
           item.fullOptions = _.cloneDeep(_fullOptions);
         });
@@ -617,7 +665,11 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
       });
     }
     // 聚合表本身特性导致具有重复ID 前端特殊处理
-    if (location.href.indexOf('/dataset?') > -1 && result?.list && !props.relQuery) {
+    if (
+      location.href.indexOf('/dataset?') > -1 &&
+      result?.list &&
+      !props.relQuery
+    ) {
       for (let i = 0; i < result.list.length; i++) {
         const item = result.list[i];
         item.id = `${result.pageNum}-${i}-${item.id}`;
@@ -687,11 +739,14 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
         setProgressData(res || null);
       });
     } else {
-      exportProgress(appCode, funCode, viewCode || (query && query.viewCode), taskType).then(
-        (res) => {
-          setProgressData(res || null);
-        },
-      );
+      exportProgress(
+        appCode,
+        funCode,
+        viewCode || (query && query.viewCode),
+        taskType,
+      ).then((res) => {
+        setProgressData(res || null);
+      });
     }
   };
   const exportData4Word = (taskType: string) => {
@@ -707,11 +762,14 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
         setProgressData4Word(res || null);
       });
     } else {
-      exportProgress(appCode, funCode, viewCode || (query && query.viewCode), taskType).then(
-        (res) => {
-          setProgressData4Word(res || null);
-        },
-      );
+      exportProgress(
+        appCode,
+        funCode,
+        viewCode || (query && query.viewCode),
+        taskType,
+      ).then((res) => {
+        setProgressData4Word(res || null);
+      });
     }
   };
   const exportData4Dataset = (taskType: string) => {
@@ -720,7 +778,12 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
       setProgressData(res || null);
     });
   };
-  const handle4Tree = async (data: any, _appCode: string, _funCode: string, _viewCode: string) => {
+  const handle4Tree = async (
+    data: any,
+    _appCode: string,
+    _funCode: string,
+    _viewCode: string,
+  ) => {
     const params = {
       viewCode: _viewCode || (query && query.viewCode),
       viewType: 'tree',
@@ -754,7 +817,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
         });
       }
     }
-    const listButtons = data.list.columns.filter((el: any) => el.dataIndex === 'ACTION');
+    const listButtons = data.list.columns.filter(
+      (el: any) => el.dataIndex === 'ACTION',
+    );
     setRelationAside({
       listButtons: listButtons[0]?.renderData.buttons || [],
       barButtons: data.bar?.buttons || [],
@@ -889,14 +954,20 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
     if (!props.mode) {
       //获取是否有导出任务并返回导出进度
-      if (location.href.indexOf('/dataset?') > -1 || query.viewType !== 'list') {
+      if (
+        location.href.indexOf('/dataset?') > -1 ||
+        query.viewType !== 'list'
+      ) {
         exportData('EXPORT');
       }
       exportData4Word('WORD_EXPORT');
     }
     remoteApi(appCode, funCode, viewCode || (query && query.viewCode))
       .then(async (data: any) => {
-        if (!data || (!data.hasOwnProperty('list') && !data.hasOwnProperty('tree'))) {
+        if (
+          !data ||
+          (!data.hasOwnProperty('list') && !data.hasOwnProperty('tree'))
+        ) {
           setHasJurisdiction(false);
           setLoading(false);
           return;
@@ -906,11 +977,21 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
         if (data.hasOwnProperty('tree')) {
           setTreeSchema(data);
           setViewType('tree');
-          await handle4Tree(data, appCode, funCode, viewCode || (query && query.viewCode));
+          await handle4Tree(
+            data,
+            appCode,
+            funCode,
+            viewCode || (query && query.viewCode),
+          );
           return;
         } else if (data.hasOwnProperty('relation')) {
           setViewType('RELATION');
-          await relationSetting(data, appCode, funCode, viewCode || (query && query.viewCode));
+          await relationSetting(
+            data,
+            appCode,
+            funCode,
+            viewCode || (query && query.viewCode),
+          );
           return;
         }
         setViewType('list');
@@ -942,7 +1023,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           data?.quickSearch?.quickSearchJsons &&
           !!data?.quickSearch?.quickSearchJsons.length
         ) {
-          setQuickSearchSchema(_.cloneDeep(data?.quickSearch?.quickSearchJsons));
+          setQuickSearchSchema(
+            _.cloneDeep(data?.quickSearch?.quickSearchJsons),
+          );
           activeCode = data?.quickSearch?.quickSearchJsons[0]?.code;
           setTabActiveCode(data?.quickSearch?.quickSearchJsons[0]?.code);
           params.qsIndex = 0;
@@ -982,11 +1065,13 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
         ) {
           data.list.columns[0].fixed = true;
         }
-        (data.list?.columns || []).forEach((item: { type: string; className?: string }) => {
-          if (item.type === 'FILE') {
-            item.className = 'qx-custom-file';
-          }
-        });
+        (data.list?.columns || []).forEach(
+          (item: { type: string; className?: string }) => {
+            if (item.type === 'FILE') {
+              item.className = 'qx-custom-file';
+            }
+          },
+        );
         setListProps({
           ...data.list,
           pageSize: data.list.pageSize || 10,
@@ -1056,7 +1141,12 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
       queryParams._sort = '';
     }
     queryParams.dataIds = dataIds || [];
-    const result = await exportPage4Word(appCode, funCode, viewCode, JSON.stringify(queryParams));
+    const result = await exportPage4Word(
+      appCode,
+      funCode,
+      viewCode,
+      JSON.stringify(queryParams),
+    );
     if (result.downloadUrl) {
       setTimeout(() => {
         exportData4Word('WORD_EXPORT');
@@ -1088,7 +1178,10 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
     }
     if (dataset) {
-      const result = await exportDatasetPage(funCode, JSON.stringify(queryParams));
+      const result = await exportDatasetPage(
+        funCode,
+        JSON.stringify(queryParams),
+      );
       setProgressData({
         percent: 0,
         status: 'PROCESSING',
@@ -1111,7 +1204,12 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           JSON.stringify(queryParams),
         );
       } else {
-        result = await exportPage(appCode, funCode, viewCode, JSON.stringify(queryParams));
+        result = await exportPage(
+          appCode,
+          funCode,
+          viewCode,
+          JSON.stringify(queryParams),
+        );
       }
       setProgressData({
         percent: 0,
@@ -1159,7 +1257,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
   useEffect(() => {
     if (exportProgressData4Word) {
       if (exportProgressData4Word.status === 'PROCESSING' && !intervalName) {
-        setIntervalName(setInterval(() => exportData4Word('WORD_EXPORT'), 1000 * 10));
+        setIntervalName(
+          setInterval(() => exportData4Word('WORD_EXPORT'), 1000 * 10),
+        );
         return;
       }
@@ -1268,7 +1368,12 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
   //操作按钮需要调用的方法
   const handleOpt = _.debounce(
-    (btn: QxActionButton, record?: any, from?: string, isChildFun?: boolean) => {
+    (
+      btn: QxActionButton,
+      record?: any,
+      from?: string,
+      isChildFun?: boolean,
+    ) => {
       if (isChildFun) {
         setChildFun(true);
       } else {
@@ -1282,7 +1387,13 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
       switch (code) {
         case 'ADD':
           if (viewType === 'tree') {
-            viewDataCtrl('add', '', viewType || '', record?.id || record?.code, btn);
+            viewDataCtrl(
+              'add',
+              '',
+              viewType || '',
+              record?.id || record?.code,
+              btn,
+            );
           } else {
             if (isChildFun) {
               if (!query._filter) {
@@ -1313,21 +1424,30 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           if ((record && record.id) || record?.code) {
             Modal.confirm({
               title: '删除确认',
-              content: btn.needConfirm ? btn.confirmContent : `确定要删除当前记录吗?`,
+              content: btn.needConfirm
+                ? btn.confirmContent
+                : `确定要删除当前记录吗?`,
               cancelText: '取消',
               okText: '确定',
               okType: 'danger',
               onOk: () => {
                 if (isChildFun) {
-                  removeRel(appCode, funCode, radioValue, record.id).then(() => {
-                    refresh();
-                    if (from && from === 'view') {
-                      drawerRef.current.close();
-                    }
-                    message.success('删除成功');
-                  });
+                  removeRel(appCode, funCode, radioValue, record.id).then(
+                    () => {
+                      refresh();
+                      if (from && from === 'view') {
+                        drawerRef.current.close();
+                      }
+                      message.success('删除成功');
+                    },
+                  );
                 } else {
-                  remove(appCode, funCode, viewCode, record?.id || record?.code).then(() => {
+                  remove(
+                    appCode,
+                    funCode,
+                    viewCode,
+                    record?.id || record?.code,
+                  ).then(() => {
                     refresh();
                     if (from && from === 'view') {
                       drawerRef.current.close();
@@ -1342,12 +1462,16 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
               if (relationkeys && relationkeys.length > 0) {
                 Modal.confirm({
                   title: '批量删除确认',
-                  content: btn.needConfirm ? btn.confirmContent : `确定要删除所选记录吗?`,
+                  content: btn.needConfirm
+                    ? btn.confirmContent
+                    : `确定要删除所选记录吗?`,
                   cancelText: '取消',
                   okText: '确定',
                   okType: 'danger',
                   onOk: () => {
-                    batchDelete(appCode, funCode, viewCode, { ids: relationkeys }).then(() => {
+                    batchDelete(appCode, funCode, viewCode, {
+                      ids: relationkeys,
+                    }).then(() => {
                       refresh();
                       message.success('删除成功');
                     });
@@ -1360,18 +1484,24 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
               if (keys && keys.length > 0) {
                 Modal.confirm({
                   title: '批量删除确认',
-                  content: btn.needConfirm ? btn.confirmContent : `确定要删除所选记录吗?`,
+                  content: btn.needConfirm
+                    ? btn.confirmContent
+                    : `确定要删除所选记录吗?`,
                   cancelText: '取消',
                   okText: '确定',
                   okType: 'danger',
                   onOk: () => {
                     if (isChildFun) {
-                      removeRelMul(appCode, funCode, radioValue, keys).then(() => {
-                        refresh();
-                        message.success('删除成功');
-                      });
+                      removeRelMul(appCode, funCode, radioValue, keys).then(
+                        () => {
+                          refresh();
+                          message.success('删除成功');
+                        },
+                      );
                     } else {
-                      batchDelete(appCode, funCode, viewCode, { ids: keys }).then(() => {
+                      batchDelete(appCode, funCode, viewCode, {
+                        ids: keys,
+                      }).then(() => {
                         refresh();
                         message.success('删除成功');
                       });
@@ -1428,7 +1558,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           if (record && record.id) {
             Modal.confirm({
               title: '移除确认',
-              content: btn.needConfirm ? btn.confirmContent : `您确认要移除吗？`,
+              content: btn.needConfirm
+                ? btn.confirmContent
+                : `您确认要移除吗？`,
               cancelText: '取消',
               okText: '确定',
               okType: 'danger',
@@ -1482,7 +1614,13 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           if (!isChildFun && viewType === 'RELATION') {
             ids = record ? [record.id] : relationkeys;
           } else {
-            ids = record ? (record.id ? [record.id] : record.code ? [record.code] : keys) : keys;
+            ids = record
+              ? record.id
+                ? [record.id]
+                : record.code
+                ? [record.code]
+                : keys
+              : keys;
           }
           //const btnSchemas = ;
           setBtnData(_.cloneDeep(btn));
@@ -1619,9 +1757,15 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           <Button
             onClick={() => {
               if (exportProgressData4Word.finalMsg > 1) {
-                handleDownload(exportProgressData4Word.downloadUrl, '导出文件.zip');
+                handleDownload(
+                  exportProgressData4Word.downloadUrl,
+                  '导出文件.zip',
+                );
               } else {
-                handleDownload(exportProgressData4Word.downloadUrl, '导出文件.docx');
+                handleDownload(
+                  exportProgressData4Word.downloadUrl,
+                  '导出文件.docx',
+                );
               }
             }}
             type={'link'}
@@ -1630,7 +1774,9 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           </Button>
           <Button
             style={{ float: 'right' }}
-            onClick={() => handleCloseExport4Word(exportProgressData4Word.taskId)}
+            onClick={() =>
+              handleCloseExport4Word(exportProgressData4Word.taskId)
+            }
             type={'link'}
           >
             【关闭提醒】
@@ -1666,9 +1812,15 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
       //存在排序时
       sortParam = {
         _field_key: _sorter?.order ? _sorter?.field : '',
-        _sort: _sorter?.order ? (_sorter?.order === 'ascend' ? 'asc' : 'desc') : '',
+        _sort: _sorter?.order
+          ? _sorter?.order === 'ascend'
+            ? 'asc'
+            : 'desc'
+          : '',
       };
-      setSorter([{ dataIndex: _sorter?.field || '', order: _sorter?.order || '' }]);
+      setSorter([
+        { dataIndex: _sorter?.field || '', order: _sorter?.order || '' },
+      ]);
       // 若列表字段没有值时，点击排序，顺序不要改变
       // 暂时注释掉   此处的判断逻辑不完善
       // const emptyArr = [];
@@ -1682,7 +1834,11 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
       //   sortParam._sort = '';
       // }
     }
-    searchApi({ pageNum: pagination.current, pageSize: pagination.pageSize, ...sortParam });
+    searchApi({
+      pageNum: pagination.current,
+      pageSize: pagination.pageSize,
+      ...sortParam,
+    });
   };
   const onActiveValue = (value: any) => {
@@ -1749,14 +1905,22 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
               height: 200,
               marginBottom: 0,
             }}
-            description={<span style={{ fontSize: '16px', color: '#999' }}>暂无权限</span>}
+            description={
+              <span style={{ fontSize: '16px', color: '#999' }}>暂无权限</span>
+            }
           />
         </>
       ) : (
         <>
           {_.size(schemaAll) > 0 && !loading ? (
-            <section className="qx-view" key={`${appCode}-${funCode}-${viewCode}`}>
-              {filterAside && filterAside.type && viewType !== 'tree' && viewType !== 'RELATION' ? (
+            <section
+              className="qx-view"
+              key={`${appCode}-${funCode}-${viewCode}`}
+            >
+              {filterAside &&
+              filterAside.type &&
+              viewType !== 'tree' &&
+              viewType !== 'RELATION' ? (
                 <QxFilterSide
                   {...filterAside}
                   data={filterTreeData}
@@ -1771,9 +1935,11 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                 <RelationSide
                   {...relationAside}
                   data={relationAsideData}
-                  onClickBtn={(btn: QxActionButton, record?: any, from?: string) =>
-                    handleOpt(btn, record, from, false)
-                  }
+                  onClickBtn={(
+                    btn: QxActionButton,
+                    record?: any,
+                    from?: string,
+                  ) => handleOpt(btn, record, from, false)}
                   selectedKeys={query._filter ? [query._filter] : ['']}
                   onSelect={handleSideSelect}
                   checkData={checkData}
@@ -1782,7 +1948,10 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                 />
               )}
-              <section className="qx-view_content" style={{ marginRight: 0, paddingRight: 0 }}>
+              <section
+                className="qx-view_content"
+                style={{ marginRight: 0, paddingRight: 0 }}
+              >
                 {viewType === 'RELATION' && relationTag?.length && (
                   <RelationList
                     value={radioValue}
@@ -1797,10 +1966,16 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                     roleId={query._filter || ''}
                   />
                 )}
-                {searchSchema?.properties && viewType !== 'tree' && radioValue !== 'sys_role' ? (
+                {searchSchema?.properties &&
+                viewType !== 'tree' &&
+                radioValue !== 'sys_role' ? (
                   <>
                     <QxSearchForm
-                      key={viewType === 'RELATION' ? radioValue + query._filter : ''}
+                      key={
+                        viewType === 'RELATION'
+                          ? radioValue + query._filter
+                          : ''
+                      }
                       onSearch={searchApi}
                       query={query}
                       onFoldChange={(foldState: boolean) => {
@@ -1813,7 +1988,11 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                 {charts.length && viewType !== 'RELATION' ? (
                   <Chart totals={charts} isRequest={false} requestIndex={-1} />
                 ) : null}
-                <div className={`qx-view-list ${isFullscreen ? 'qx-view-list_full' : ''}`}>
+                <div
+                  className={`qx-view-list ${
+                    isFullscreen ? 'qx-view-list_full' : ''
+                  }`}
+                >
                   {viewType !== 'tree' && (
                     <div className="qx-view-container__toolbar">
                       {quickSearchSchema && !!quickSearchSchema.length ? (
@@ -1850,7 +2029,11 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                           {...optBar}
                           changeFullscreen={changeFullscreen}
                           isFullscreen={isFullscreen}
-                          onClickBtn={(btn: QxActionButton, record?: any, from?: string) => {
+                          onClickBtn={(
+                            btn: QxActionButton,
+                            record?: any,
+                            from?: string,
+                          ) => {
                             if (viewType === 'RELATION') {
                               handleOpt(btn, record, from, true);
                             } else {
@@ -1883,10 +2066,15 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                         <Alert
                           style={{ marginBottom: '12px' }}
                           message={getExportMessage4Word()}
-                          type={EXPORT_STATUS[exportProgressData4Word.status] || 'info'}
+                          type={
+                            EXPORT_STATUS[exportProgressData4Word.status] ||
+                            'info'
+                          }
                           showIcon
                           onClose={() => {
-                            handleCloseExport4Word(exportProgressData4Word.taskId);
+                            handleCloseExport4Word(
+                              exportProgressData4Word.taskId,
+                            );
                           }}
                         />
                       ) : null}
@@ -1923,7 +2111,11 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
                       loading={tableLoading}
                       dataSource={dataSource}
                       sort={sorter}
-                      onClickBtn={(btn: QxActionButton, record?: any, from?: string) => {
+                      onClickBtn={(
+                        btn: QxActionButton,
+                        record?: any,
+                        from?: string,
+                      ) => {
                         if (viewType === 'RELATION') {
                           handleOpt(btn, record, from, true);
                         } else {
@@ -2075,7 +2267,10 @@ export const ListViewCore: React.FC<ListViewCoreProps> = ({
           }}
         />
       }
-      <SubformEdit batchEditParam={batchEditParam} saveCallBack={saveCallBack} />
+      <SubformEdit
+        batchEditParam={batchEditParam}
+        saveCallBack={saveCallBack}
+      />
       <Modal
         title={'更新历史'}
         width={'800px'}
@@ -2154,7 +2349,10 @@ export const ListViewDialog: React.FC<ListViewDialogProps> = ({
 const PageList: React.FC = () => {
   const [loading, setLoading] = useState<boolean>(true);
   // @ts-ignore
-  const { appCode, funCode, viewCode } = useParams<{ appCode: string; funCode: string }>();
+  const { appCode, funCode, viewCode } = useParams<{
+    appCode: string;
+    funCode: string;
+  }>();
   // @ts-ignore
   const { query, pathname } = useLocation();
@@ -2165,7 +2363,9 @@ const PageList: React.FC = () => {
   const [views, setViews] = useState<any[]>([]);
   const [processing, setProcessing] = useState<boolean>(false);
   const [processMessage, setProcessMessage] = useState<string>('');
-  const [currentViewCode, setCurrentViewCode] = useState<string>(query.viewCode || '');
+  const [currentViewCode, setCurrentViewCode] = useState<string>(
+    query.viewCode || '',
+  );
   const [isSysPage, setIsSysPage] = useState(false);
   const [dataset, setDataset] = useState(false);
@@ -2293,7 +2493,9 @@ const PageList: React.FC = () => {
             onTabChange(viewArr[0]?.code || '');
           } else {
             const _viewCode = query.viewCode || viewCode;
-            if (viewArr?.findIndex((item: any) => item.code === _viewCode) > -1) {
+            if (
+              viewArr?.findIndex((item: any) => item.code === _viewCode) > -1
+            ) {
               onTabChange(_viewCode);
             } else {
               onTabChange(viewArr[0]?.code || '');
@@ -2305,7 +2507,10 @@ const PageList: React.FC = () => {
         .catch((e) => {
           setLoading(false);
           setViews([]);
-          if (e.errCode === 'FUN_ERROR_FUN_PROCESSING' || e.errCode === 'APP_UPGRADE_PROCESSING') {
+          if (
+            e.errCode === 'FUN_ERROR_FUN_PROCESSING' ||
+            e.errCode === 'APP_UPGRADE_PROCESSING'
+          ) {
             if (e.errCode === 'APP_UPGRADE_PROCESSING') {
               e.msg = 'UPGRADE' + e.msg;
             }
@@ -2330,7 +2535,9 @@ const PageList: React.FC = () => {
             </Button>,
           ]
         : [];
-    return loading ? null : <Exception404 showGoBackLink={false} buttons={buttons} />;
+    return loading ? null : (
+      <Exception404 showGoBackLink={false} buttons={buttons} />
+    );
   };
   const getErrMsg = (msg: string) => {
@@ -2364,7 +2571,11 @@ const PageList: React.FC = () => {
                     {pane.name}
                     {pane?.hidden && (
                       <EyeInvisibleOutlined
-                        style={{ fontSize: '12px', marginLeft: '5px', color: '#b6b6b6' }}
+                        style={{
+                          fontSize: '12px',
+                          marginLeft: '5px',
+                          color: '#b6b6b6',
+                        }}
                       />
                     )}
                   </span>