页面美化

src/main.js

@@ -10,13 +10,14 @@ const before = new BeforeEnter()
 
 Vue.use(ElementUI)
 
-Vue.prototype.openLoading = function() {
+Vue.prototype.openLoading = function(HTMLElement = 'HTMLElement') {
   const loading = this.$loading({
     lock: true,
     text: '正在努力加载中...',
     spinner: 'el-icon-loading',
     background: 'rgba(0, 0, 0, 0.3)',
-    target: '.sub-main',
+    target: HTMLElement,
+    // target: '.sub-main',
     body: true,
     customClass: 'mask'
   })

src/pages/v2/cases/index.vue

@@ -32,6 +32,7 @@
           border
           stripe
           size="mini"
+          class="table-list"
           style="width: 100%">
           <el-table-column
             fixed
@@ -124,7 +125,7 @@
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
             :current-page="currentPage"
-            :page-sizes="[10, 20, 30, 50, 100]"
+            :page-sizes="[3, 5, 10, 20, 30, 50, 100]"
             :page-size="limit"
             layout="total, sizes, prev, pager, next, jumper"
             :total="totalPage">
@@ -371,7 +372,7 @@ export default {
       opera: '',
       currentPage: 1,
       totalPage: 0,
-      limit: 10,
+      limit: 3,
       levelArr: [
         { level: 1, content: '低风险' },
         { level: 2, content: '中风险' },
@@ -448,7 +449,7 @@ export default {
       this.list({ page: val, limit: this.limit })
     },
     list(params = {}) {
-      const rLoading = this.openLoading()
+      const rLoading = this.openLoading('.table-list')
       casesApi.case2s(params).then(res => {
         if (res.code === 0) {
           this.tableData = res.data.data
@@ -521,7 +522,7 @@ export default {
     },
     handleDelete(id) {
       this.$confirm('确认删除？', '提示').then(_ => {
-        const rLoading = this.openLoading()
+        const rLoading = this.openLoading('.table-list')
         casesApi.deleteCase2(id).then(res => {
           if (res.code === 0) {
             this.$message.success('删除成功')
@@ -591,7 +592,7 @@ export default {
         .then(_ => {
           this.loading = true
           // 提交表单
-          const rLoading = this.openLoading()
+          const rLoading = this.openLoading('.table-list')
           casesApi.createCase2(this.addForm).then(res => {
             if (res.code === 0 && res.message === 'SUCCESS') {
               this.list({ page: this.currentPage, limit: this.limit })

src/pages/v2/categories/category.vue

@@ -20,6 +20,7 @@
           :data="tableData"
           style="width: 100%"
           size="mini"
+          class="table-list"
           row-key="id"
           border
           :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
@@ -78,7 +79,7 @@
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
             :current-page="currentPage"
-            :page-sizes="[20, 30, 40, 50]"
+            :page-sizes="[3, 5, 10, 20, 30, 40, 50]"
             :page-size="limit"
             layout="total, sizes, prev, pager, next, jumper"
             :total="totalPage">
@@ -225,7 +226,7 @@ export default {
       tableData: [],
       opera: '',
       currentPage: 1,
-      limit: 20,
+      limit: 3,
       totalPage: 0,
       parentName: '',
       urlDisabled: false,
@@ -350,7 +351,7 @@ export default {
       this.$message.error('文件上传失败')
     },
     list(params = {}) {
-      const rLoading = this.openLoading()
+      const rLoading = this.openLoading('.table-list')
       categoryApi.categories(params).then(res => {
         if (res.code === 0) {
           this.tableData = res.data.data
@@ -382,7 +383,7 @@ export default {
     },
     handleDelete(id) {
       this.$confirm('确认删除？', '提示').then(_ => {
-        const rLoading = this.openLoading()
+        const rLoading = this.openLoading('.table-list')
         categoryApi.deleteCategory(id).then(res => {
           if (res.code === 0) {
             this.$message.success('删除成功')
@@ -424,7 +425,7 @@ export default {
       }
     },
     add() {
-      const rLoading = this.openLoading()
+      const rLoading = this.openLoading('.table-list')
       categoryApi.addCategory(this.mainForm).then(res => {
         if (res.code === -1) {
           this.$message.error(res.message)
@@ -437,7 +438,7 @@ export default {
       })
     },
     addChild() {
-      const rLoading = this.openLoading()
+      const rLoading = this.openLoading('.table-list')
       categoryApi.addCategory(this.childForm).then(res => {
         if (res.code === -1) {
           this.$message.error(res.message)

src/pages/v2/characteristics/index.vue

@@ -31,6 +31,7 @@
           :data="tableData"
           border
           stripe
+          class="table-list"
           size="mini"
           style="width: 100%">
           <el-table-column fixed width="150px" label="案例名称">
@@ -421,12 +422,15 @@ export default {
     },
     handleDelete(id) {
       this.$confirm('确认删除？', '提示').then(_ => {
+        const rLoading = this.openLoading('.table-list')
         characteristicsApi.deleteCharacteristic2(id).then(res => {
           if (res.code === 0) {
-            this.$message.success('删除成功')
             this.list({ page: this.currentPage, limit: this.limit })
+            rLoading.close()
+            this.$message.success('删除成功')
             return true
           } else {
+            rLoading.close()
             this.$message.error(res.message)
             return false
           }
@@ -434,7 +438,7 @@ export default {
       })
     },
     list(params = {}) {
-      const rLoading = this.openLoading()
+      const rLoading = this.openLoading('.table-list')
       characteristicsApi.characteristics2List(params).then(res => {
         if (res.code === 0) {
           this.tableData = res.data.data
@@ -476,7 +480,7 @@ export default {
         .then(_ => {
           this.loading = true
           // 提交表单
-          const rLoading = this.openLoading()
+          const rLoading = this.openLoading('.table-list')
           characteristicsApi.createCharacteristic2(this.addForm).then(res => {
             if (res.code === 0) {
               this.list({ page: 1, limit: this.limit })

src/pages/v2/reachschemes/index.vue

@@ -32,6 +32,7 @@
           border
           stripe
           size="mini"
+          class="table-list"
           style="width: 100%">
           <el-table-column fixed label="案例名称">
             <template slot-scope="scope">
@@ -210,7 +211,7 @@ export default {
     },
     delete(id) {
       this.$confirm('确认删除？', '提示').then(_ => {
-        const rLoading = this.openLoading()
+        const rLoading = this.openLoading('.table-list')
         reachSchemeApi.deleteReachScheme(id).then(res => {
           if (res.code === 0) {
             this.$message.success('删除成功')
@@ -226,7 +227,7 @@ export default {
       })
     },
     list(params = {}) {
-      const rLoading = this.openLoading()
+      const rLoading = this.openLoading('.table-list')
       reachSchemeApi.reachSchemeList(params).then(res => {
         if (res.code === 0) {
           this.tableData = res.data.data
@@ -266,7 +267,7 @@ export default {
         .then(_ => {
           this.loading = true
           // 提交表单
-          const rLoading = this.openLoading()
+          const rLoading = this.openLoading('.table-list')
           reachSchemeApi.createReachScheme(this.addForm).then(res => {
             if (res.code === 0) {
               this.list({ page: 1, limit: this.limit })