diff --git a/app/src/protyle/render/av/col.ts b/app/src/protyle/render/av/col.ts
index 01165edc1..b3529a373 100644
--- a/app/src/protyle/render/av/col.ts
+++ b/app/src/protyle/render/av/col.ts
@@ -117,7 +117,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: HTMLElement, cellEl
                     action: "setAttrView",
                     id: avId,
                     data: {
-                        sorts: response.data.av.sorts
+                        sorts: response.data.view.sorts
                     }
                 }]);
             });
@@ -141,7 +141,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: HTMLElement, cellEl
                     action: "setAttrView",
                     id: avId,
                     data: {
-                        sorts: response.data.av.sorts
+                        sorts: response.data.view.sorts
                     }
                 }]);
             });
@@ -152,7 +152,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: HTMLElement, cellEl
         label: window.siyuan.languages.filter,
         click() {
             fetchPost("/api/av/renderAttributeView", {id: avId}, (response) => {
-                const avData = response.data.av as IAV;
+                const avData = response.data.view as IAVTable;
                 let filter: IAVFilter;
                 avData.filters.find((item) => {
                     if (item.column === colId) {
diff --git a/app/src/protyle/render/av/filter.ts b/app/src/protyle/render/av/filter.ts
index 26afb82a8..5e5d4cb13 100644
--- a/app/src/protyle/render/av/filter.ts
+++ b/app/src/protyle/render/av/filter.ts
@@ -42,7 +42,7 @@ export const getCellValue = (colType: TAVCol, value: string) => {
 export const setFilter = (options: {
     filter: IAVFilter,
     protyle: IProtyle,
-    data: IAV,
+    data: IAVTable,
     target: HTMLElement,
 }) => {
     const colType = Object.keys(options.filter.value)[0] as TAVCol;
@@ -228,7 +228,7 @@ export const setFilter = (options: {
 };
 
 export const addFilter = (options: {
-    data: IAV,
+    data: IAVTable,
     rect: DOMRect,
     menuElement: HTMLElement,
     tabRect: DOMRect,
@@ -293,7 +293,7 @@ export const addFilter = (options: {
     });
 };
 
-export const getFiltersHTML = (data: IAV) => {
+export const getFiltersHTML = (data: IAVTable) => {
     let html = "";
     const genFilterItem = (filter: IAVFilter) => {
         let filterHTML = "";
diff --git a/app/src/protyle/render/av/openMenuPanel.ts b/app/src/protyle/render/av/openMenuPanel.ts
index a8755c6b6..d3962e2a1 100644
--- a/app/src/protyle/render/av/openMenuPanel.ts
+++ b/app/src/protyle/render/av/openMenuPanel.ts
@@ -20,7 +20,7 @@ export const openMenuPanel = (protyle: IProtyle,
     window.siyuan.menus.menu.remove();
     const avId = blockElement.getAttribute("data-av-id");
     fetchPost("/api/av/renderAttributeView", {id: avId}, (response) => {
-        const data = response.data.av as IAV;
+        const data = response.data.view as IAVTable;
         let html;
         if (type === "config") {
             html = getConfigHTML(data);
@@ -483,7 +483,7 @@ export const openMenuPanel = (protyle: IProtyle,
     });
 };
 
-const getPropertiesHTML = (data: IAV) => {
+const getPropertiesHTML = (data: IAVTable) => {
     let showHTML = "";
     let hideHTML = "";
     data.columns.forEach((item: IAVColumn) => {
@@ -554,7 +554,7 @@ ${hideHTML}
 </button>`;
 };
 
-const getConfigHTML = (data: IAV) => {
+const getConfigHTML = (data: IAVTable) => {
     return `<button class="b3-menu__item" data-type="nobg">
     <span class="b3-menu__label">${window.siyuan.languages.config}</span>
     <svg class="b3-menu__action" data-type="close" style="opacity: 1"><use xlink:href="#iconCloseRound"></use></svg>
diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts
index a43811ecc..2f4388faa 100644
--- a/app/src/protyle/render/av/render.ts
+++ b/app/src/protyle/render/av/render.ts
@@ -19,7 +19,7 @@ export const avRender = (element: Element, cb?: () => void) => {
                 return;
             }
             fetchPost("/api/av/renderAttributeView", {id: e.getAttribute("data-av-id")}, (response) => {
-                const data = response.data.av as IAV;
+                const data = response.data.view as IAVTable;
                 // header
                 let tableHTML = '<div class="av__row av__row--header"><div class="av__firstcol"><svg style="height: 42px"><use xlink:href="#iconUncheck"></use></svg></div>';
                 data.columns.forEach((column: IAVColumn) => {
@@ -80,6 +80,13 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
                     });
                     tableHTML += "<div></div></div>";
                 });
+                let tabHTML = ""
+                response.data.views.forEach((item:IAVView) => {
+                    tabHTML +=`<div class="item${item.id === response.data.viewID ? " item--focus" : ""}">
+    <svg class="item__graphic"><use xlink:href="#iconTable"></use></svg>
+    <span class="item__text">${item.name}</span>
+</div>`
+                })
                 const paddingLeft = e.parentElement.style.paddingLeft;
                 const paddingRight = e.parentElement.style.paddingRight;
                 e.style.width = e.parentElement.clientWidth + "px";
@@ -87,10 +94,7 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
                 e.firstElementChild.outerHTML = `<div>
     <div class="av__header" style="padding-left: ${paddingLeft};padding-right: ${paddingRight};">
         <div class="layout-tab-bar fn__flex">
-            <div class="item item--focus">
-                <svg class="item__graphic"><use xlink:href="#iconTable"></use></svg>
-                <span class="item__text">${data.type}</span>
-            </div>
+            ${tabHTML}
             <div class="fn__flex-1"></div>
             <span data-type="av-filter" class="block__icon block__icon--show b3-tooltips b3-tooltips__w${data.filters.length > 0 ? " block__icon--active" : ""}" aria-label="${window.siyuan.languages.filter}">
                 <svg><use xlink:href="#iconFilter"></use></svg>
@@ -105,7 +109,7 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
             </span>
             <div class="fn__space"></div>
         </div>
-        <div contenteditable="true" class="av__title" data-title="${data.name || ""}" data-tip="${window.siyuan.languages.title}">${data.name || ""}</div>
+        <div contenteditable="true" class="av__title" data-title="${data.name || ""}" data-tip="${window.siyuan.languages.title}">${response.data.name || ""}</div>
         <div class="av__counter fn__none"></div>
     </div>
     <div class="av__scroll">
diff --git a/app/src/protyle/render/av/select.ts b/app/src/protyle/render/av/select.ts
index f7d6e3309..f98d39420 100644
--- a/app/src/protyle/render/av/select.ts
+++ b/app/src/protyle/render/av/select.ts
@@ -43,7 +43,7 @@ const filterSelectHTML = (key: string, options: { name: string, color: string }[
     return html;
 };
 
-export const removeSelectCell = (protyle: IProtyle, data: IAV, options: {
+export const removeSelectCell = (protyle: IProtyle, data: IAVTable, options: {
     cellElement: HTMLElement
 }, target: HTMLElement) => {
     if (!target) {
@@ -100,7 +100,7 @@ export const removeSelectCell = (protyle: IProtyle, data: IAV, options: {
     }]);
 }
 
-export const setSelectCol = (protyle: IProtyle, data: IAV, options: {
+export const setSelectCol = (protyle: IProtyle, data: IAVTable, options: {
     cellElement: HTMLElement;
 }, target: HTMLElement,) => {
     const menuElement = hasClosestByClassName(target, "b3-menu");
@@ -303,7 +303,7 @@ export const setSelectCol = (protyle: IProtyle, data: IAV, options: {
     inputElement.select();
 };
 
-export const bindSelectEvent = (protyle: IProtyle, data: IAV, menuElement: HTMLElement, options: {
+export const bindSelectEvent = (protyle: IProtyle, data: IAVTable, menuElement: HTMLElement, options: {
     cellElement: HTMLElement
 }) => {
     const inputElement = menuElement.querySelector("input");
@@ -346,7 +346,7 @@ export const bindSelectEvent = (protyle: IProtyle, data: IAV, menuElement: HTMLE
     });
 };
 
-export const addSelectColAndCell = (protyle: IProtyle, data: IAV, options: {
+export const addSelectColAndCell = (protyle: IProtyle, data: IAVTable, options: {
     cellElement: HTMLElement
 }, currentElement: HTMLElement, menuElement: HTMLElement) => {
     const rowId = options.cellElement.parentElement.dataset.id;
@@ -435,7 +435,7 @@ export const addSelectColAndCell = (protyle: IProtyle, data: IAV, options: {
     }
 }
 
-export const getSelectHTML = (data: IAV, options: { cellElement: HTMLElement }) => {
+export const getSelectHTML = (data: IAVTable, options: { cellElement: HTMLElement }) => {
     const cellId = options.cellElement.dataset.id;
     const colId = options.cellElement.dataset["colId"];
     const colData = data.columns.find(item => {
diff --git a/app/src/protyle/render/av/sort.ts b/app/src/protyle/render/av/sort.ts
index 3416806cb..5a9cf60c9 100644
--- a/app/src/protyle/render/av/sort.ts
+++ b/app/src/protyle/render/av/sort.ts
@@ -4,7 +4,7 @@ import {transaction} from "../../wysiwyg/transaction";
 import {setPosition} from "../../../util/setPosition";
 
 export const addSort = (options: {
-    data: IAV,
+    data: IAVTable,
     rect: DOMRect,
     menuElement: HTMLElement,
     tabRect: DOMRect,
@@ -57,7 +57,7 @@ export const addSort = (options: {
     });
 };
 
-export const bindSortsEvent = (protyle: IProtyle, menuElement: HTMLElement, data: IAV) => {
+export const bindSortsEvent = (protyle: IProtyle, menuElement: HTMLElement, data: IAVTable) => {
     menuElement.querySelectorAll("select").forEach((item: HTMLSelectElement) => {
         item.addEventListener("change", () => {
             const colId = item.parentElement.getAttribute("data-id");
@@ -90,7 +90,7 @@ export const bindSortsEvent = (protyle: IProtyle, menuElement: HTMLElement, data
     });
 };
 
-export const getSortsHTML = (data: IAV) => {
+export const getSortsHTML = (data: IAVTable) => {
     let html = "";
     const genSortItem = (id: string) => {
         let sortHTML = "";
diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts
index f8b4e4bde..2b05ae0ff 100644
--- a/app/src/types/index.d.ts
+++ b/app/src/types/index.d.ts
@@ -842,7 +842,13 @@ interface IBazaarItem {
     preferredFunding: string
 }
 
-interface IAV {
+interface IAVView {
+    name: string
+    id: string
+    type: string
+}
+
+interface IAVTable {
     columns: IAVColumn[],
     filters: IAVFilter[],
     sorts: IAVSort[],