update

src/api/table.js

@@ -59,3 +59,18 @@ export function PageQueryMyJoinCourseList_Student(data) {
     data
   });
 }
+
+/**
+ * 分页查询课程列表
+ * @param {Object} data
+ */
+export function PageQueryCourseList(data) {
+  let params = getRequestParams('page_query-PageQueryCourseList');
+
+  return request({
+    method: 'post',
+    url: process.env.VUE_APP_LearnWebSI,
+    params,
+    data
+  });
+}

src/layouts/components/LayoutHeader.vue

@@ -221,7 +221,7 @@ export default {
   },
   methods: {
     // 切换导航
-    handleSelect(key, keyPath) {
+    handleSelect(key) {
       this.activeIndex = key;
       if (this.activeIndex === '1') {
         window.location.href = '/';
@@ -279,9 +279,7 @@ export default {
     getLangList() {
       GetLanguageList().then(({ language_list }) => {
         this.language_list = language_list;
-        let curLang = language_list.find(el => {
-          return el.language_type === this.language_type;
-        });
+        let curLang = language_list.find(el => el.language_type === this.language_type);
         this.lang = curLang ? curLang.language_name : '中文';
       });
     },

src/store/modules/user.js

@@ -13,7 +13,8 @@ const getDefaultSate = () => {
     user_type: isHas ? token.user_type : '',
     user_name: isHas ? token.user_name : '',
     image_url: isHas ? token.image_url : '',
-    language_type: isHas ? (token.language_type ? token.language_type : 'ZH') : 'ZH'
+    language_type: isHas ? (token.language_type ? token.language_type : 'ZH') : 'ZH',
+    popedom_code_list: isHas ? token.popedom_code_list : []
   };
 };
 
@@ -25,7 +26,15 @@ const mutations = {
   },
   [user.SET_USER_INFO]: (
     state,
-    { user_code, user_real_name, user_type, language_type, session_id, image_url }
+    {
+      user_code,
+      user_real_name,
+      user_type,
+      language_type,
+      session_id,
+      image_url,
+      popedom_code_list
+    }
   ) => {
     state.user_code = user_code;
     state.user_real_name = user_real_name;
@@ -34,6 +43,7 @@ const mutations = {
     state.session_id = session_id;
     state.image_url = image_url;
     state.language_type = language_type || 'ZH';
+    state.popedom_code_list = popedom_code_list;
   },
   [user.UPDATE_LANGUAGE_TYPE]: (state, language_type) => {
     const { token, isHas } = getToken();

src/views/main/TemplateList.vue

@@ -0,0 +1,224 @@
+<template>
+  <div class="template">
+    <!-- 查询条件 -->
+    <div class="template-search">
+      <div>
+        <el-input
+          v-model="name"
+          class="search-name"
+          prefix-icon="el-icon-search"
+          @change="queryCourseList"
+        >
+          <el-button slot="append" @click="queryCourseList">搜索</el-button>
+        </el-input>
+      </div>
+      <div>
+        <el-select v-model="release_status">
+          <el-option
+            v-for="item in releaseStatusList"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value"
+          />
+        </el-select>
+        <el-button class="query-button" type="primary" @click="queryCourseList">查询</el-button>
+      </div>
+    </div>
+    <!-- 模板列表 -->
+    <div class="template-container">
+      <div class="template-container-title">
+        <span>模板库</span>
+        <el-button class="create" @click="$router.push('/create_course?isTemplate=true')">
+          <div><svg-icon icon-class="create" /><span>创建模板</span></div>
+        </el-button>
+      </div>
+      <div class="template-container-list">
+        <el-table :data="courseList">
+          <el-table-column prop="name" label="课程名称" width="320" />
+          <el-table-column label="课程周期" width="210">
+            <template slot-scope="{ row }">
+              <i class="el-icon-date" /> {{ row.begin_date }} - {{ row.end_date }}
+            </template>
+          </el-table-column>
+          <el-table-column label="已发布">
+            <template slot-scope="{ row }">
+              {{ row.is_release === 'true' ? '√' : '' }}
+            </template>
+          </el-table-column>
+          <el-table-column fixed="right" width="80">
+            <template slot-scope="{ row }">
+              <el-dropdown trigger="click">
+                <span class="el-dropdown-link">
+                  <svg-icon icon-class="more" />
+                </span>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item @click.native="edit(row.id)">
+                    <svg-icon icon-class="edit" /> 编辑
+                  </el-dropdown-item>
+                  <el-dropdown-item
+                    v-if="row.is_release === 'false'"
+                    @click.native="releaseCourse(row.id, true)"
+                  >
+                    <svg-icon icon-class="publish" /> 发布
+                  </el-dropdown-item>
+                  <el-dropdown-item v-else @click.native="releaseCourse(row.id, false)">
+                    <svg-icon icon-class="undo" /> 取消发布
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <el-pagination
+      background
+      :page-sizes="[10, 20, 30, 40, 50]"
+      :page-size="page_capacity"
+      layout="prev, pager, next, total, sizes, jumper"
+      :total="total_count"
+      :current-page="cur_page"
+      @prev-click="changePage"
+      @next-click="changePage"
+      @current-change="changePage"
+      @size-change="changePageSize"
+    />
+  </div>
+</template>
+
+<script>
+import { PageQueryCourseList } from '@/api/table';
+import { ReleaseCourse } from '@/api/course';
+
+export default {
+  data() {
+    return {
+      // 查询条件
+      name: '',
+      page_capacity: 10,
+      cur_page: 0,
+      total_count: 0,
+      release_status: -1,
+      releaseStatusList: [
+        {
+          name: '全部',
+          value: -1
+        },
+        {
+          name: '已发布',
+          value: 1
+        },
+        {
+          name: '未发布',
+          value: 0
+        }
+      ],
+      // 课程列表
+      courseList: []
+    };
+  },
+  created() {
+    this.queryCourseList();
+  },
+  methods: {
+    changePage(newPage) {
+      this.cur_page = newPage;
+      this.queryCourseList();
+    },
+    changePageSize(pageSize) {
+      this.page_capacity = pageSize;
+      this.queryCourseList();
+    },
+    queryCourseList() {
+      const queryCriteria = {
+        is_template: true,
+        name: this.name,
+        page_capacity: this.page_capacity,
+        cur_page: this.cur_page,
+        release_status: this.release_status
+      };
+      PageQueryCourseList(queryCriteria).then(({ course_list, total_count }) => {
+        this.courseList = course_list;
+        this.total_count = total_count;
+      });
+    },
+    edit(id) {
+      this.$router.push(`/create_course_step_table/course_info?id=${id}&isTemplate=true`);
+    },
+    releaseCourse(course_id, is_release) {
+      ReleaseCourse({ course_id, is_release }).then(() => {
+        this.queryCourseList();
+        this.$message.success(`${is_release ? '' : '取消'}发布课程成功`);
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+@import '~@/styles/mixin.scss';
+
+.template {
+  @include pagination;
+
+  &-search {
+    display: flex;
+    justify-content: space-between;
+
+    .search-name {
+      width: 528px;
+    }
+
+    .query-button {
+      width: 114px;
+      margin-left: 12px;
+    }
+  }
+
+  &-container {
+    width: 100%;
+    min-height: calc(100vh - 325px);
+    margin-top: 16px;
+    background-color: #fff;
+    border-radius: 8px;
+
+    &-title {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size: 20px;
+      font-weight: bold;
+      padding: 32px;
+
+      .create {
+        width: 138px;
+
+        div {
+          display: flex;
+          justify-content: space-around;
+        }
+      }
+    }
+
+    &-list {
+      @include list;
+
+      margin-top: 0;
+
+      .el-dropdown {
+        cursor: pointer;
+
+        .svg-icon {
+          font-size: 19px;
+        }
+      }
+    }
+  }
+}
+</style>
+
+<style scoped>
+.el-dropdown-menu .svg-icon {
+  margin-right: 8px;
+}
+</style>

src/views/main/curricula_list/teacher.vue

@@ -248,15 +248,6 @@ export default {
           font-size: 19px;
         }
       }
-
-      .status-name {
-        display: inline-block;
-        width: 8px;
-        height: 8px;
-        border-radius: 50%;
-        margin-right: 8px;
-        margin-bottom: 1px;
-      }
     }
   }
 }

src/views/main/index.vue

@@ -1,13 +1,15 @@
 <template>
   <div class="main-container">
     <div class="menu">
-      <span
-        v-for="item in menuList"
-        :key="item.id"
-        v-t="item.name"
-        :class="['menu-tab', { active: currentTab === item.tab }]"
-        @click="currentTab = item.tab"
-      />
+      <template v-for="item in menuList">
+        <span
+          v-if="item.isShow"
+          :key="item.id"
+          v-t="item.name"
+          :class="['menu-tab', { active: currentTab === item.tab }]"
+          @click="currentTab = item.tab"
+        />
+      </template>
     </div>
     <keep-alive>
       <component :is="currentTabComponent" />
@@ -19,6 +21,7 @@
 import TaskList from './TaskList';
 import CurriculaListStudent from './curricula_list/student';
 import CurriculaListTeacher from './curricula_list/teacher';
+import TemplateList from './TemplateList.vue';
 import { updateWordPack } from '@/utils/i18n';
 
 export default {
@@ -26,28 +29,41 @@ export default {
   components: {
     TaskList,
     CurriculaListStudent,
-    CurriculaListTeacher
+    CurriculaListTeacher,
+    TemplateList
   },
   data() {
+    let popedom_code_list = this.$store.state.user.popedom_code_list;
+    let isStudent = this.$store.state.user.user_type === 'STUDENT';
+
     return {
       currentTab: this.$route.query.tab || 'TaskList',
+      popedom_code_list,
       menuList: [
         {
           id: 1,
           name: '任务列表',
-          tab: 'TaskList'
+          tab: 'TaskList',
+          isShow: isStudent || popedom_code_list.includes(2000001)
         },
         {
           id: 2,
           name: '课程列表',
-          tab: 'CurriculaList'
+          tab: 'CurriculaList',
+          isShow: isStudent || popedom_code_list.includes(2000001)
+        },
+        {
+          id: 3,
+          name: '模板列表',
+          tab: 'TemplateList',
+          isShow: !isStudent && popedom_code_list.includes(2000002)
         }
       ]
     };
   },
   computed: {
     currentTabComponent: function () {
-      if (this.currentTab === 'TaskList') {
+      if (['TemplateList', 'TaskList'].includes(this.currentTab)) {
         return this.currentTab;
       }
       let suffix = this.$store.state.user.user_type === 'TEACHER' ? 'Teacher' : 'Student';
@@ -76,7 +92,7 @@ export default {
 
   // 切换菜单
   .menu {
-    width: 318px;
+    display: inline-block;
     border-radius: 30px;
     margin-bottom: 32px;
     background-color: #ebebeb;