refactor: independent sheet. (#110)

src/api/sheet.js

@@ -12,9 +12,9 @@ sheetApi.list = params => {
   })
 }
 
-sheetApi.listInternal = () => {
+sheetApi.listIndependent = () => {
   return service({
-    url: `${baseUrl}/internal`,
+    url: `${baseUrl}/independent`,
     method: 'get'
   })
 }

src/config/router.config.js

@@ -76,21 +76,21 @@ export const asyncRouterMap = [
             path: '/sheets/links',
             name: 'LinkList',
             hidden: true,
-            component: () => import('@/views/sheet/internal/LinkList'),
+            component: () => import('@/views/sheet/independent/LinkList'),
             meta: { title: '友情链接', hiddenHeaderContent: false }
           },
           {
             path: '/sheets/photos',
             name: 'PhotoList',
             hidden: true,
-            component: () => import('@/views/sheet/internal/PhotoList'),
+            component: () => import('@/views/sheet/independent/PhotoList'),
             meta: { title: '图库', hiddenHeaderContent: false }
           },
           {
             path: '/sheets/journals',
             name: 'JournalList',
             hidden: true,
-            component: () => import('@/views/sheet/internal/JournalList'),
+            component: () => import('@/views/sheet/independent/JournalList'),
             meta: { title: '日志', hiddenHeaderContent: false }
           }
         ]

src/views/sheet/SheetList.vue

@@ -4,11 +4,11 @@
       <a-col :span="24">
         <div class="card-container">
           <a-tabs type="card">
-            <a-tab-pane key="internal">
+            <a-tab-pane key="independent">
               <span slot="tab">
-                <a-icon type="paper-clip" />内置页面
+                <a-icon type="paper-clip" />独立页面
               </span>
-              <InternalSheetList />
+              <IndependentSheetList />
             </a-tab-pane>
             <a-tab-pane key="custom">
               <span slot="tab">
@@ -24,12 +24,12 @@
 </template>
 
 <script>
-import InternalSheetList from './components/InternalSheetList'
+import IndependentSheetList from './components/IndependentSheetList'
 import CustomSheetList from './components/CustomSheetList'
 
 export default {
   components: {
-    InternalSheetList,
+    IndependentSheetList,
     CustomSheetList
   }
 }

src/views/sheet/components/CustomSheetList.vue

@@ -408,7 +408,6 @@ export default {
       selectedMetas: [],
       sheetSettingVisible: false,
       sheetCommentVisible: false,
-      internalSheets: [],
       sheets: [],
       menu: {}
     }

src/views/sheet/components/IndependentSheetList.vue

@@ -6,7 +6,7 @@
       itemLayout="vertical"
       size="large"
       :pagination="false"
-      :dataSource="internalSheets"
+      :dataSource="independentSheets"
       :loading="loading"
     >
       <a-list-item
@@ -17,27 +17,14 @@
         <template slot="actions">
           <span>
             <router-link
-              :to="{name:'LinkList'}"
+              :to="{name:item.routeName}"
-              v-if="item.id==1"
-            >
-              <a-icon type="edit" />
-            </router-link>
-            <router-link
-              :to="{name:'PhotoList'}"
-              v-if="item.id==2"
-            >
-              <a-icon type="edit" />
-            </router-link>
-            <router-link
-              :to="{name:'JournalList'}"
-              v-if="item.id==3"
             >
               <a-icon type="edit" />
             </router-link>
           </span>
         </template>
         <template slot="extra">
-          <span v-if="item.status">可用</span>
+          <span v-if="item.available">可用</span>
           <span v-else>不可用
             <a-tooltip
               slot="action"
@@ -53,12 +40,12 @@
             style="max-width: 300px;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;"
           >
             <a
-              :href="item.url"
+              :href="item.fullPath"
               target="_blank"
-              v-if="item.status"
+              v-if="item.available"
             >{{ item.title }}</a>
             <a
-              :href="item.url"
+              :href="item.fullPath"
               target="_blank"
               disabled
               v-else
@@ -72,17 +59,17 @@
     <!-- Desktop -->
     <a-table
       v-else
-      :columns="internalColumns"
+      :columns="independentColumns"
-      :dataSource="internalSheets"
+      :dataSource="independentSheets"
       :pagination="false"
-      :rowKey="page => page.id"
+      :rowKey="sheet => sheet.id"
       :loading="loading"
     >
       <template
-        slot="status"
+        slot="available"
-        slot-scope="status"
+        slot-scope="available"
       >
-        <span v-if="status">可用</span>
+        <span v-if="available">可用</span>
         <span v-else>不可用
           <a-tooltip
             slot="action"
@@ -97,31 +84,18 @@
         slot-scope="text, record"
       >
         <router-link
-          :to="{name:'LinkList'}"
+          :to="{name:record.routeName}"
-          v-if="record.id==1"
-        >
-          <a href="javascript:void(0);">管理</a>
-        </router-link>
-        <router-link
-          :to="{name:'PhotoList'}"
-          v-if="record.id==2"
-        >
-          <a href="javascript:void(0);">管理</a>
-        </router-link>
-        <router-link
-          :to="{name:'JournalList'}"
-          v-if="record.id==3"
         >
           <a href="javascript:void(0);">管理</a>
         </router-link>
         <a-divider type="vertical" />
         <a
-          :href="record.url"
+          :href="record.fullPath"
           target="_blank"
-          v-if="record.status"
+          v-if="record.available"
         >访问</a>
         <a
-          :href="record.url"
+          :href="record.fullPath"
           target="_blank"
           disabled
           v-else
@@ -133,19 +107,19 @@
 <script>
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import sheetApi from '@/api/sheet'
-const internalColumns = [
+const independentColumns = [
   {
     title: '页面名称',
     dataIndex: 'title'
   },
   {
     title: '访问地址',
-    dataIndex: 'url'
+    dataIndex: 'fullPath'
   },
   {
     title: '状态',
-    dataIndex: 'status',
+    dataIndex: 'available',
-    scopedSlots: { customRender: 'status' }
+    scopedSlots: { customRender: 'available' }
   },
   {
     title: '操作',
@@ -155,23 +129,23 @@ const internalColumns = [
   }
 ]
 export default {
-  name: 'InternalSheetList',
+  name: 'IndependentSheetList',
   mixins: [mixin, mixinDevice],
   data() {
     return {
-      internalColumns,
+      independentColumns,
-      internalSheets: [],
+      independentSheets: [],
       loading: false
     }
   },
   created() {
-    this.loadInternalSheets()
+    this.loadIndependentSheets()
   },
   methods: {
-    loadInternalSheets() {
+    loadIndependentSheets() {
       this.loading = true
-      sheetApi.listInternal().then(response => {
+      sheetApi.listIndependent().then(response => {
-        this.internalSheets = response.data.data
+        this.independentSheets = response.data.data
         this.loading = false
       })
     }