diff --git a/resources/assets/js/pages/manage/components/ProjectArchived.vue b/resources/assets/js/pages/manage/components/ProjectArchived.vue
index 9705a9eb..31ea2978 100644
--- a/resources/assets/js/pages/manage/components/ProjectArchived.vue
+++ b/resources/assets/js/pages/manage/components/ProjectArchived.vue
@@ -21,14 +21,18 @@
             class="page-container"
             :total="total"
             :current="page"
+            :pageSize="pageSize"
             :disabled="loadIng > 0"
-            simple
+            :simple="windowMax768"
+            showTotal
             @on-change="setPage"
             @on-page-size-change="setPageSize"/>
     </div>
 </template>
 
 <script>
+import {mapState} from "vuex";
+
 export default {
     name: "ProjectArchived",
     data() {
@@ -49,6 +53,9 @@ export default {
     mounted() {
         this.getLists();
     },
+    computed: {
+        ...mapState(['windowMax768'])
+    },
     methods: {
         initLanguage() {
             this.columns = [
diff --git a/resources/assets/js/pages/manage/components/ProjectManagement.vue b/resources/assets/js/pages/manage/components/ProjectManagement.vue
index d599bbde..56a318f5 100644
--- a/resources/assets/js/pages/manage/components/ProjectManagement.vue
+++ b/resources/assets/js/pages/manage/components/ProjectManagement.vue
@@ -33,14 +33,18 @@
             class="page-container"
             :total="total"
             :current="page"
+            :pageSize="pageSize"
             :disabled="loadIng > 0"
-            simple
+            :simple="windowMax768"
+            showTotal
             @on-change="setPage"
             @on-page-size-change="setPageSize"/>
     </div>
 </template>
 
 <script>
+import {mapState} from "vuex";
+
 export default {
     name: "ProjectManagement",
     data() {
@@ -61,6 +65,9 @@ export default {
     mounted() {
         this.getLists();
     },
+    computed: {
+        ...mapState(['windowMax768'])
+    },
     methods: {
         initLanguage() {
             this.columns = [
diff --git a/resources/assets/js/pages/manage/components/TaskArchived.vue b/resources/assets/js/pages/manage/components/TaskArchived.vue
index dc87d826..0e264782 100644
--- a/resources/assets/js/pages/manage/components/TaskArchived.vue
+++ b/resources/assets/js/pages/manage/components/TaskArchived.vue
@@ -6,14 +6,18 @@
             class="page-container"
             :total="total"
             :current="page"
+            :pageSize="pageSize"
             :disabled="loadIng > 0"
-            simple
+            :simple="windowMax768"
+            showTotal
             @on-change="setPage"
             @on-page-size-change="setPageSize"/>
     </div>
 </template>
 
 <script>
+import {mapState} from "vuex";
+
 export default {
     name: "TaskArchived",
     props: {
@@ -37,6 +41,9 @@ export default {
     },
     mounted() {
 
+    },
+    computed: {
+        ...mapState(['windowMax768'])
     },
     watch: {
         projectId: {
diff --git a/resources/assets/js/pages/manage/components/TeamManagement.vue b/resources/assets/js/pages/manage/components/TeamManagement.vue
index ad3f786f..3a49d677 100644
--- a/resources/assets/js/pages/manage/components/TeamManagement.vue
+++ b/resources/assets/js/pages/manage/components/TeamManagement.vue
@@ -49,14 +49,18 @@
             class="page-container"
             :total="total"
             :current="page"
+            :pageSize="pageSize"
             :disabled="loadIng > 0"
-            simple
+            :simple="windowMax768"
+            showTotal
             @on-change="setPage"
             @on-page-size-change="setPageSize"/>
     </div>
 </template>
 
 <script>
+import {mapState} from "vuex";
+
 export default {
     name: "TeamManagement",
     data() {
@@ -77,6 +81,9 @@ export default {
     mounted() {
         this.getLists();
     },
+    computed: {
+        ...mapState(['windowMax768'])
+    },
     methods: {
         initLanguage() {
             this.columns = [