模板列表页样式 及文件夹名称显示

src/router/index.ts

@@ -101,7 +101,7 @@ const routes: RouteConfig[] = [
     // this generates a separate chunk (about.[hash].js) for this route
     // which is lazy-loaded when the route is visited.
     component: () => import(/* webpackChunkName: "templ-list" */ '@/views/template/List.vue'),
-    props: (route) => ({ templList: route.query.templList }),
+    props: ({query: {templList, folderName}}) => ({ templList, folderName }),
     meta: { requiresAuth: true },
   },
   {

src/views/index/Index-sy.vue

@@ -18,7 +18,7 @@
           <li
             v-for="{ id, folder_simg_url, folder_name, detail} of systemList"
             :key="id"
-            @click="goTemplList(detail)"
+            @click="goTemplList(detail, folder_name)"
           >
             <van-image :src="folder_simg_url" width="44px" height="64px" fit="contain"></van-image>
             <div style="font-size:14px;color:#353535;">{{folder_name}}</div>
@@ -34,7 +34,7 @@
       </div>
         <empty v-if="!list.length && !loading" name="moban" tip="您还未添加模板"></empty>
         <div>
-          <div class="folder-item" v-for="{id, folder_simg_url, folder_name, detail} of list" :key="id" @click="goTemplList(detail)">
+          <div class="folder-item" v-for="{id, folder_simg_url, folder_name, detail} of list" :key="id" @click="goTemplList(detail, folder_name)">
            <van-image
             class="thumb"
             :src="folder_simg_url"
@@ -81,18 +81,9 @@ export default class IndexSy extends Mixins(IndexMixin) {
   private async onIsLoginChange(newVal: boolean, oldVal: boolean) {
     if (!newVal) {
       this.loading = false;
-    }
-    if (newVal) {
-      const promises = Promise.all([
-                                    this.getProofCount(),
-                                    this.$api.template.folderList({
-                                                                  template_type: 1,
-                                                                })]);
-      const [ , folderListResult ] = await promises;
-      const { results = [] } = folderListResult;
-      const ids = results.map((folder: any) => folder.id);
-      const res = await this.$api.template.list({id: ids});
-      this.list = res.results || [];
+    } else {
+      const promises = [this.getProofCount(),this.getUserFolders()];
+      await Promise.all(promises);
       this.loading = false;
     }
   }
@@ -110,8 +101,8 @@ export default class IndexSy extends Mixins(IndexMixin) {
   private toLogin() {
     this.$router.push({name: 'Login'});
   }
-  private goTemplList(templList: [] = []) {
-    this.$router.push({ name: 'TemplList', query: { templList: JSON.stringify(templList) } });
+  private goTemplList(templList: [] = [], folderName = '') {
+    this.$router.push({ name: 'TemplList', query: { templList: JSON.stringify(templList) ,folderName} });
   }
 }
 </script>

src/views/template/List.vue

 <template>
   <div class="template-list">
+    <div style="display:flex;flex-direction:row;justify-content:space-between;align-items:center;"><span>{{folderName}}</span><router-link to="addTemplate" tag="p" style="color:#3F79FE;">+添加模板</router-link></div>
      <empty v-if="!list" name="moban" tip="您还未添加模板" style="margin-top:30vh"></empty>
      <template-item 
       v-for="{id, s_image_url, name, info} of list" 
@@ -29,6 +30,8 @@ export default class Index extends Vue {
   @Prop({
   })
   private templList!: string;
+  @Prop()
+  private folderName!: string;
   @Watch('templList', { immediate: true, deep: true })
   private async onRouteChange(newTemplList: string, oldTemplList: string) {
     this.list = JSON.parse(newTemplList);