更新

src/components/pages.vue

@@ -0,0 +1,61 @@
+<template>
+  <div id="pagination">
+    <el-row type="flex" align="middle" style="padding-top:1rem">
+      <el-col :span="24" :style="`text-align:${position};`">
+        <p>
+          <span class="newpage">
+            跟帖<span class="gentie">{{ total }}</span></span
+          >
+          <span
+            ><el-pagination background layout=" total, prev, pager, next" :page-size="limit" :current-page.sync="currentPage" @current-change="changePage">
+            </el-pagination
+          ></span>
+        </p>
+        <!-- 
+          :page-sizes="[5, 10, 15, 20, 50, 100]"
+          @size-change="sizeChange"
+         -->
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import _ from 'lodash';
+export default {
+  name: 'pagination',
+  props: {
+ 
+    position: { type: String, default: 'right' },
+    total: { type: Number, default: 0 },
+    limit: { type: Number, default: 10 },
+  },
+  components: {},
+  data: () => {
+    return {
+      currentPage: 1,
+    };
+  },
+  created() {},
+  methods: {
+    changePage(page) {
+      this.$emit('query', { skip: (page - 1) * this.limit, limit: this.limit });
+    },
+    sizeChange(limit) {
+      this.limit = limit;
+      this.$emit('query', { skip: 0, limit: this.limit });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.newpage {
+  width: 92%;
+  float: left;
+}
+.gentie {
+  color: red;
+  font-size: 20px;
+}
+</style>

src/layout/technical/semDetail.vue

@@ -68,7 +68,9 @@
               </el-col>
             </el-col>
             <el-col :span="24" class="twoPage">
-              <page :total="total" :limit="limit" position="right" @query="search"></page>
+              <p>
+                <span> <page :limit="limit" :total="total" position="right" @query="search"></page></span>
+              </p>
             </el-col>
             <el-col :span="24" class="twoInput">
               <el-col :span="3" class="left"> </el-col>
@@ -90,7 +92,7 @@
 
 <script>
 import wangEditor from '@/components/wang-editor.vue';
-import page from '@/components/pagination.vue';
+import page from '@/components/pages.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: comment } = createNamespacedHelpers('comment');
 const { mapActions: news } = createNamespacedHelpers('news');
@@ -316,4 +318,8 @@ export default {
 /deep/.main .two .twoInput .right .btn .el-button {
   margin: 10px 0;
 }
+.pages {
+  float: right;
+  width: 100px;
+}
 </style>