diff --git a/src/assets/img/product/1.png b/src/assets/img/product/1.png
new file mode 100644
index 0000000..169313e
Binary files /dev/null and b/src/assets/img/product/1.png differ
diff --git a/src/assets/img/product/2.png b/src/assets/img/product/2.png
new file mode 100644
index 0000000..2ef8fe6
Binary files /dev/null and b/src/assets/img/product/2.png differ
diff --git a/src/assets/img/product/3.png b/src/assets/img/product/3.png
new file mode 100644
index 0000000..cc1947c
Binary files /dev/null and b/src/assets/img/product/3.png differ
diff --git a/src/assets/img/product/4.png b/src/assets/img/product/4.png
new file mode 100644
index 0000000..c23df8a
Binary files /dev/null and b/src/assets/img/product/4.png differ
diff --git a/src/assets/img/product/5.png b/src/assets/img/product/5.png
new file mode 100644
index 0000000..83b2807
Binary files /dev/null and b/src/assets/img/product/5.png differ
diff --git a/src/pages/product/list/index.vue b/src/pages/product/list/index.vue
index f44e1de..926d74e 100644
--- a/src/pages/product/list/index.vue
+++ b/src/pages/product/list/index.vue
@@ -1,608 +1,687 @@
 <template>
-    <div class="wrap">
-        <el-carousel :interval="6000" :height="carouselHeight">
-          <template v-for="(item, i) in banners">
-            <el-carousel-item :key="i">
-              <div :class="['banner-item', {'cursor-pointer': item.url}]" @click="openLink(item)">
-                <img :src="item.banner" alt="" :style="{height: carouselHeight}">
-                <p class="banner-name">{{ item.title }}</p>
-              </div>
-            </el-carousel-item>
-          </template>
-        </el-carousel>
-        
-        <div class="inner">
-          <div class="typw-wrap">
-            <div>
-              <img src="@/assets/img/hot.png" alt="">
-              <img class="m-l-5 m-r-10" src="@/assets/img/type.png" alt="">
-              <ul class="tab">
-                <li v-for="(tab, i) in tabs" :key="i" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li>
-              </ul>
-            </div>
-            <div class="search">
-              <img class="icon" src="@/assets/img/search.png" alt="">
-              <input type="text" placeholder="请输入产品名称" v-model="form.productName">
-            </div>
+  <div class="wrap">
+    <el-carousel :interval="6000"
+                 :height="carouselHeight">
+      <template v-for="(item, i) in banners">
+        <el-carousel-item :key="i">
+          <div :class="['banner-item', {'cursor-pointer': item.url}]"
+               @click="openLink(item)">
+            <img :src="item.banner"
+                 alt=""
+                 :style="{height: carouselHeight}">
+            <p class="banner-name">{{ item.title }}</p>
           </div>
-          <div class="filter">
-            <dl v-if="curTab == 1">
-              <dt>学科专业</dt>
+        </el-carousel-item>
+      </template>
+    </el-carousel>
+
+    <div class="inner">
+      <div class="typw-wrap">
+        <div>
+          <img src="@/assets/img/hot.png"
+               alt="">
+          <img class="m-l-5 m-r-10"
+               src="@/assets/img/type.png"
+               alt="">
+          <ul class="tab">
+            <li v-for="(tab, i) in tabs"
+                :key="i"
+                :class="{active: curTab === tab.id}"
+                @click="tabChange(tab)">{{ tab.name }}</li>
+          </ul>
+        </div>
+        <div class="search">
+          <img class="icon"
+               src="@/assets/img/search.png"
+               alt="">
+          <input type="text"
+                 placeholder="请输入产品名称"
+                 v-model="form.productName">
+        </div>
+      </div>
+      <div class="filter">
+        <dl v-if="curTab == 1">
+          <dt>学科专业</dt>
 
-              <dd>学科类别</dd>
-              <el-select v-model="form.categoryId" clearable @change="getProfessionalClass()" @clear="clearClass()">
-                <el-option label="不限" value=""></el-option>
-                <el-option v-for="(item,index) in subjectList" :key="index" :label="item.disciplineName" :value="item.disciplineId"></el-option>
-              </el-select>
+          <dd>学科类别</dd>
+          <el-select v-model="form.categoryId"
+                     clearable
+                     @change="getProfessionalClass()"
+                     @clear="clearClass()">
+            <el-option label="不限"
+                       value=""></el-option>
+            <el-option v-for="(item,index) in subjectList"
+                       :key="index"
+                       :label="item.disciplineName"
+                       :value="item.disciplineId"></el-option>
+          </el-select>
 
-              <dd style="margin: 0 0 0 50px">专业类</dd>
-              <el-select v-model="form.professionalCategoryId" clearable :disabled="form.categoryId ? false : true" @change="getProfessional" @clear="clearProfess()">
-                <el-option label="不限" value=""></el-option>
-                <el-option v-for="(item,index) in professionalClassList" :key="index" :label="item.professionalClassName" :value="item.professionalClassId"></el-option>
-              </el-select>
+          <dd style="margin: 0 0 0 50px">专业类</dd>
+          <el-select v-model="form.professionalCategoryId"
+                     clearable
+                     :disabled="form.categoryId ? false : true"
+                     @change="getProfessional"
+                     @clear="clearProfess()">
+            <el-option label="不限"
+                       value=""></el-option>
+            <el-option v-for="(item,index) in professionalClassList"
+                       :key="index"
+                       :label="item.professionalClassName"
+                       :value="item.professionalClassId"></el-option>
+          </el-select>
 
-              <dd style="margin: 0 0 0 50px">专业</dd>
-              <el-select v-model="form.professionalId" clearable :disabled="form.professionalCategoryId ? false : true" @change="initData">
-                <el-option label="不限" value=""></el-option>
-                <el-option v-for="(item,index) in professionalList" :key="index" :label="item.professionalName" :value="item.professionalId"></el-option>
-              </el-select>
-            </dl>
-            <dl v-if="curTab == 3">
-              <dt>产品标签</dt>
-              <div class="vals">
-                <dd :class="{active: form.tagId === ''}" @click="filterChange('', 'tagId')">全部</dd>
-                <dd v-for="(item, i) in labels" :key="i" :class="{active: form.tagId === item.tagsId}" @click="filterChange(item.tagsId, 'tagId')">{{ item.tagsName }}</dd>
-              </div>
-            </dl>
-            <dl>
-              <dt>产品类型</dt>
-              <div class="vals">
-                <dd :class="{active: form.productClassification === ''}" @click="filterChange('', 'productClassification')">全部</dd>
-                <dd v-for="(item, i) in classifications" :key="i" :class="{active: form.productClassification === item.typeId}" @click="filterChange(item.typeId, 'productClassification')">{{ item.typeName }}</dd>
-              </div>
-            </dl>
-            <dl>
-              <dt>购买状态</dt>
-              <dd v-for="(item, i) in status" :key="i" :class="{active: form.purchaseStatus === item.id}" @click="filterChange(item.id, 'purchaseStatus')">{{ item.name }}</dd>
-            </dl>
+          <dd style="margin: 0 0 0 50px">专业</dd>
+          <el-select v-model="form.professionalId"
+                     clearable
+                     :disabled="form.professionalCategoryId ? false : true"
+                     @change="initData">
+            <el-option label="不限"
+                       value=""></el-option>
+            <el-option v-for="(item,index) in professionalList"
+                       :key="index"
+                       :label="item.professionalName"
+                       :value="item.professionalId"></el-option>
+          </el-select>
+        </dl>
+        <dl v-if="curTab == 3">
+          <dt>产品标签</dt>
+          <div class="vals">
+            <dd :class="{active: form.tagId === ''}"
+                @click="filterChange('', 'tagId')">全部</dd>
+            <dd v-for="(item, i) in labels"
+                :key="i"
+                :class="{active: form.tagId === item.tagsId}"
+                @click="filterChange(item.tagsId, 'tagId')">{{ item.tagsName }}</dd>
           </div>
-          
-          <div class="filter m-t-20">
-            <dl>
-              <dd v-for="(item, i) in sorts" :key="i" :class="{active: form.sort === item.id}" @click="filterChange(item.id, 'sort')">{{ item.name }}</dd>
-              <dd :class="{active: form.sort === 2 || form.sort === 5}" @click="sort">发布时间</dd>
-              <span class="caret" @click="sort">
-                <i :class="['asc', {active: form.sort === 2}]"></i>
-                <i :class="['desc', {active: form.sort === 5}]"></i>
-              </span>
-            </dl>
+        </dl>
+        <dl>
+          <dt>产品类型</dt>
+          <div class="vals">
+            <dd :class="{active: form.productClassification === ''}"
+                @click="filterChange('', 'productClassification')">全部</dd>
+            <dd v-for="(item, i) in classifications"
+                :key="i"
+                :class="{active: form.productClassification === item.typeId}"
+                @click="filterChange(item.typeId, 'productClassification')">{{ item.typeName }}</dd>
           </div>
+        </dl>
+        <dl>
+          <dt>购买状态</dt>
+          <dd v-for="(item, i) in status"
+              :key="i"
+              :class="{active: form.purchaseStatus === item.id}"
+              @click="filterChange(item.id, 'purchaseStatus')">{{ item.name }}</dd>
+        </dl>
+      </div>
 
-          <div class="courses">
-            <template v-if="list.length">
-              <ul>
-                <li v-for="(item, i) in list" :key="i" @click="toDetail(item.mallId)">
-                  <img :src="item.coverDrawing" alt="" />
-                  <img v-if="item.logoOfOurSchool" class="my-school" src="@/assets/img/my-school.png" alt="">
-                  <div class="texts">
-                    <el-tooltip effect="dark" :visible-arrow="false" :content="item.productName" placement="bottom">
-                      <div class="title">{{ item.productName }}</div>
-                    </el-tooltip>
-                    <div class="desc" v-html="item.productIntroduction"></div>
-                      <div class="tags">
-                    <el-tooltip v-if="item.tagsName" class="item" effect="dark" :visible-arrow="false" :content="item.tagsName" placement="bottom">
-                      <div>
-                        <el-tag v-for="(tag, i) in item.tagsName.split(',')" :key="i" class="tag">{{ tag }}</el-tag>
-                      </div>
-                    </el-tooltip>
-                      </div>
-                    <div :class="['metas', {'not-selected': !item.selected}]">
-                      <el-tag
-                        v-if="item.selected"
-                        type="danger"
-                        effect="dark">
-                        官方精选
-                      </el-tag>
-                      <div v-if="item.isCourse" class="meta">{{ item.learningCount }}人学过</div>
+      <div class="filter m-t-20">
+        <dl>
+          <dd v-for="(item, i) in sorts"
+              :key="i"
+              :class="{active: form.sort === item.id}"
+              @click="filterChange(item.id, 'sort')">{{ item.name }}</dd>
+          <dd :class="{active: form.sort === 2 || form.sort === 5}"
+              @click="sort">发布时间</dd>
+          <span class="caret"
+                @click="sort">
+            <i :class="['asc', {active: form.sort === 2}]"></i>
+            <i :class="['desc', {active: form.sort === 5}]"></i>
+          </span>
+        </dl>
+      </div>
+
+      <div class="courses">
+        <template v-if="list.length">
+          <ul>
+            <li v-for="(item, i) in list"
+                :key="i"
+                @click="toDetail(item.mallId)">
+              <img :src="item.coverDrawing"
+                   alt="" />
+              <img v-if="item.logoOfOurSchool"
+                   class="my-school"
+                   src="@/assets/img/my-school.png"
+                   alt="">
+              <div class="texts">
+                <el-tooltip effect="dark"
+                            :visible-arrow="false"
+                            :content="item.productName"
+                            placement="bottom">
+                  <div class="title">{{ item.productName }}</div>
+                </el-tooltip>
+                <div class="desc"
+                     v-html="item.productIntroduction"></div>
+                <div class="tags">
+                  <el-tooltip v-if="item.tagsName"
+                              class="item"
+                              effect="dark"
+                              :visible-arrow="false"
+                              :content="item.tagsName"
+                              placement="bottom">
+                    <div>
+                      <el-tag v-for="(tag, i) in item.tagsName.split(',')"
+                              :key="i"
+                              class="tag">{{ tag }}</el-tag>
                     </div>
-                  </div>
-                </li>
-              </ul>
-              <div class="pagination">
-                <el-pagination background layout="total, prev, pager, next" :page-size="pageSize" :total="total" @current-change="handleCurrentChange" :current-page="page"></el-pagination>
+                  </el-tooltip>
+                </div>
+                <div :class="['metas', {'not-selected': !item.selected}]">
+                  <el-tag v-if="item.selected"
+                          type="danger"
+                          effect="dark">
+                    官方精选
+                  </el-tag>
+                  <div v-if="item.isCourse"
+                       class="meta">{{ item.learningCount }}人学过</div>
+                </div>
               </div>
-            </template>
+            </li>
+          </ul>
+          <div class="pagination">
+            <el-pagination background
+                           layout="total, prev, pager, next"
+                           :page-size="pageSize"
+                           :total="total"
+                           @current-change="handleCurrentChange"
+                           :current-page="page"></el-pagination>
           </div>
-        </div>
+        </template>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
 import { Loading } from "element-ui";
 import Setting from "@/setting";
 export default {
-    data() {
-        return {
-            carouselHeight: '336px',
-            banners: [],
-            timer: null,
-            curTab: '',
-            tabs: [
-              {
-                id: '',
-                name: '全部'
-              },
-              {
-                id: 1,
-                name: '学科专业'
-              },
-              {
-                id: 2,
-                name: '产品精选'
-              },
-              {
-                id: 3,
-                name: '热门标签'
-              },
-            ],
-            form: {
-              categoryId: '',
-              isShelves: 0,
-              hotTag: 1,
-              professionalCategoryId: '',
-              professionalId: '',
-              productClassification: '',
-              productName: '',
-              purchaseStatus: '',
-              sort: 0,
-              tagId: ''
-            },
-            labels: [],
-            subjectList: [], //专业学科
-            professionalClassList: [], //专业类
-            professionalList: [], //专业
-            classifications: [],
-            status: [
-              {
-                id: '',
-                name: '全部'
-              },
-              {
-                id: 1,
-                name: '已购买'
-              },
-              {
-                id: 2,
-                name: '未购买'
-              },
-            ],
-            sorts: [
-              {
-                id: 0,
-                name: '综合排序'
-              },
-              {
-                id: 1,
-                name: '热销排行'
-              },
-            ],
-            list: [
-              {
-                coverUrl: 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20230220/jpg/1627584816180912128.jpg',
-                courseName: '理论课程'
-              },
-              {
-                coverUrl: 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20230220/jpg/1627584816180912128.jpg',
-                courseName: '理论课程'
-              },
-              {
-                coverUrl: 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20230220/jpg/1627584816180912128.jpg',
-                courseName: '理论课程'
-              },
-            ],
-            keyword: '',
-            total: 0,
-            page: 1,
-            pageSize: 12,
-            searchTimer: null,
-            loadIns: null
-        };
-    },
-    watch: {
-        'form.productName': function(val) {
-            clearTimeout(this.searchTimer);
-            this.searchTimer = setTimeout(() => {
-                this.initData();
-            }, 500);
-        }
-    },
-    mounted() {
-      console.log(11, parseInt(window.innerWidth / 5.7))
-      this.carouselHeight = parseInt(window.innerWidth / 5.7) + 'px'
-      this.getBanner()
-      this.getSubject()
-      this.getLabel()
-      this.getClass()
-      this.initData()
-    },
-    methods: {
-        // 获取banner
-        getBanner() {
-          this.$post(this.api.listMarketing, {
-            pageNum: 1,
-            pageSize: 1000,
-            isOpen: 0
-          }).then(({ page }) => {
-              this.banners = page.records
-          }).catch(res => {})
-        },
-        // 获取列表
-        getData() {
-          this.loadIns = Loading.service()
-          this.$post(this.api.listOfGoods, {
-            ...this.form,
-            pageNum: this.page,
-            pageSize: this.pageSize,
-          }).then(({ page }) => {
-            const list = page.records
-            list.forEach(e => {
-              // 简介去掉标签图片
-              const el = document.createElement('div')
-              el.innerHTML = e.productIntroduction
-              e.productIntroduction = el.innerText
-              const cid = e.classificationId
-              e.isCourse = (cid === 1 || cid === 2) && !e.isAssociatedProduct
-            })
-            this.list = list
-            this.total = page.total
-            this.loadIns.close()
-          }).catch(res => {
-            this.loadIns.close()
-          })
-        },
-        initData() {
-            this.page = 1;
-            this.getData();
-        },
-        
-        // 获取产品分类
-        getLabel() {
-          this.$get(this.api.tagsList).then(res => {
-            this.labels = res.tagsList
-          }).catch(err => {})
-        },
-        // 获取学科类别
-        getSubject() {
-            this.$get(this.api.courseDiscipline).then(res => {
-                this.subjectList = res.list;
-            }).catch(err => {
-            });
+  data () {
+    return {
+      carouselHeight: '336px',
+      banners: [],
+      timer: null,
+      curTab: '',
+      tabs: [
+        {
+          id: '',
+          name: '全部'
         },
-        // 清除学科类别
-        clearClass() {
-            this.form.professionalCategoryId = "";
-            this.form.professionalId = "";
+        {
+          id: 1,
+          name: '学科专业'
         },
-        // 获取专业类
-        getProfessionalClass() {
-            this.clearClass();
-            this.getProfessionalClassData();
-            this.initData();
+        {
+          id: 2,
+          name: '产品精选'
         },
-        getProfessionalClassData() {
-            let data = {
-                disciplineId: this.form.categoryId
-            };
-            this.$get(this.api.courseProfessionalClass, data).then(res => {
-                this.professionalClassList = res.list;
-            }).catch(err => {
-            });
+        {
+          id: 3,
+          name: '热门标签'
         },
-        // 清除专业类
-        clearProfess() {
-            this.form.professionalId = "";
+      ],
+      form: {
+        categoryId: '',
+        isShelves: 0,
+        hotTag: 1,
+        professionalCategoryId: '',
+        professionalId: '',
+        productClassification: '',
+        productName: '',
+        purchaseStatus: '',
+        sort: 0,
+        tagId: ''
+      },
+      labels: [],
+      subjectList: [], //专业学科
+      professionalClassList: [], //专业类
+      professionalList: [], //专业
+      classifications: [],
+      status: [
+        {
+          id: '',
+          name: '全部'
         },
-        // 获取专业
-        getProfessional() {
-            this.clearProfess();
-            this.getProfessionalData();
-            this.initData();
+        {
+          id: 1,
+          name: '已购买'
         },
-        getProfessionalData() {
-            let data = {
-                professionalClassId: this.form.professionalCategoryId
-            };
-            this.$get(this.api.courseProfessional, data).then(res => {
-                this.professionalList = res.list;
-            }).catch(err => {
-            });
+        {
+          id: 2,
+          name: '未购买'
         },
-        // 获取产品类型
-        getClass() {
-          this.$get(this.api.productTypeList).then(res => {
-            this.classifications = res.typeList
-          }).catch(err => {})
+      ],
+      sorts: [
+        {
+          id: 0,
+          name: '综合排序'
         },
-        // 获取分类
-        getClassification() {
-          this.$post(this.api.listClassification, {
-            pageNum: 1,
-            pageSize: 1000,
-            platformSource
-          }).then(({ page }) => {
-            this.classificationList = page.records
-          }).catch(res => {})
+        {
+          id: 1,
+          name: '热销排行'
         },
-        // tab切换
-        tabChange({ id }) {
-          this.curTab = id
-          this.form.hotTag = 1
-          this.form.selection = ''
-          if (id === 3) {
-            this.form.hotTag = 2
-          } else if (id === 2) {
-            this.form.selection = 1
-          }
-          this.initData()
+      ],
+      list: [
+        {
+          coverUrl: 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20230220/jpg/1627584816180912128.jpg',
+          courseName: '理论课程'
         },
-        // 类型切换
-        filterChange(id, prop) {
-          this.form[prop] = id
-          this.initData()
+        {
+          coverUrl: 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20230220/jpg/1627584816180912128.jpg',
+          courseName: '理论课程'
         },
-        // 发布时间排序
-        sort() {
-          this.form.sort = this.form.sort === 2 ? 5 : 2
-          this.initData()
+        {
+          coverUrl: 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20230220/jpg/1627584816180912128.jpg',
+          courseName: '理论课程'
         },
-        handleCurrentChange(val) {
-            this.page = val;
-            this.getData();
-        },
-        // 跳转详情
-        toDetail(id) {
-            this.$router.push(`show?id=${id}`);
-        }
+      ],
+      keyword: '',
+      total: 0,
+      page: 1,
+      pageSize: 12,
+      searchTimer: null,
+      loadIns: null
+    };
+  },
+  watch: {
+    'form.productName': function (val) {
+      clearTimeout(this.searchTimer);
+      this.searchTimer = setTimeout(() => {
+        this.initData();
+      }, 500);
+    }
+  },
+  mounted () {
+    console.log(11, parseInt(window.innerWidth / 5.7))
+    this.carouselHeight = parseInt(window.innerWidth / 5.7) + 'px'
+    this.getBanner()
+    this.getSubject()
+    this.getLabel()
+    this.getClass()
+    this.initData()
+  },
+  methods: {
+    // 获取banner
+    getBanner () {
+      this.$post(this.api.listMarketing, {
+        pageNum: 1,
+        pageSize: 1000,
+        isOpen: 0
+      }).then(({ page }) => {
+        this.banners = page.records
+      }).catch(res => { })
+    },
+    // 获取列表
+    getData () {
+      this.loadIns = Loading.service()
+      this.$post(this.api.listOfGoods, {
+        ...this.form,
+        pageNum: this.page,
+        pageSize: this.pageSize,
+      }).then(({ page }) => {
+        const list = page.records
+        list.forEach(e => {
+          // 简介去掉标签图片
+          const el = document.createElement('div')
+          el.innerHTML = e.productIntroduction
+          e.productIntroduction = el.innerText
+          const cid = e.classificationId
+          e.isCourse = (cid === 1 || cid === 2) && !e.isAssociatedProduct
+        })
+        this.list = list
+        this.total = page.total
+        this.loadIns.close()
+      }).catch(res => {
+        this.loadIns.close()
+      })
+    },
+    initData () {
+      this.page = 1;
+      this.getData();
+    },
+
+    // 获取产品分类
+    getLabel () {
+      this.$get(this.api.tagsList).then(res => {
+        this.labels = res.tagsList
+      }).catch(err => { })
+    },
+    // 获取学科类别
+    getSubject () {
+      this.$get(this.api.courseDiscipline).then(res => {
+        this.subjectList = res.list;
+      }).catch(err => {
+      });
+    },
+    // 清除学科类别
+    clearClass () {
+      this.form.professionalCategoryId = "";
+      this.form.professionalId = "";
+    },
+    // 获取专业类
+    getProfessionalClass () {
+      this.clearClass();
+      this.getProfessionalClassData();
+      this.initData();
+    },
+    getProfessionalClassData () {
+      let data = {
+        disciplineId: this.form.categoryId
+      };
+      this.$get(this.api.courseProfessionalClass, data).then(res => {
+        this.professionalClassList = res.list;
+      }).catch(err => {
+      });
+    },
+    // 清除专业类
+    clearProfess () {
+      this.form.professionalId = "";
+    },
+    // 获取专业
+    getProfessional () {
+      this.clearProfess();
+      this.getProfessionalData();
+      this.initData();
+    },
+    getProfessionalData () {
+      let data = {
+        professionalClassId: this.form.professionalCategoryId
+      };
+      this.$get(this.api.courseProfessional, data).then(res => {
+        this.professionalList = res.list;
+      }).catch(err => {
+      });
+    },
+    // 获取产品类型
+    getClass () {
+      this.$get(this.api.productTypeList).then(res => {
+        this.classifications = res.typeList
+      }).catch(err => { })
+    },
+    // 获取分类
+    getClassification () {
+      this.$post(this.api.listClassification, {
+        pageNum: 1,
+        pageSize: 1000,
+        platformSource
+      }).then(({ page }) => {
+        this.classificationList = page.records
+      }).catch(res => { })
+    },
+    // banner点击
+    openLink (item) {
+      item.url && window.open(item.url)
+    },
+    // tab切换
+    tabChange ({ id }) {
+      this.curTab = id
+      this.form.hotTag = 1
+      this.form.selection = ''
+      if (id === 3) {
+        this.form.hotTag = 2
+      } else if (id === 2) {
+        this.form.selection = 1
+      }
+      this.initData()
+    },
+    // 类型切换
+    filterChange (id, prop) {
+      this.form[prop] = id
+      this.initData()
+    },
+    // 发布时间排序
+    sort () {
+      this.form.sort = this.form.sort === 2 ? 5 : 2
+      this.initData()
+    },
+    handleCurrentChange (val) {
+      this.page = val;
+      this.getData();
+    },
+    // 跳转详情
+    toDetail (id) {
+      this.$router.push(`show?id=${id}`);
     }
+  }
 };
 </script>
 
 <style lang="scss" scoped>
 .wrap {
-  margin: -24px;
-  .banner-item {
-    position: relative;
-    img {
-      width: 100%;
-      height: 100%;
-    }
-    .banner-name {
-      position: absolute;
-      top: 116px;
-      left: 188px;
-      font-size: 50px;
-      color: #2E2D31;
-    }
-  }
-  .inner {
-    width: 1146px;
-    margin: 18px auto;
-  }
-  .typw-wrap {
-    display: flex;
-    justify-content: space-between;
-    margin-bottom: 18px;
-    .left {
-      display: inline-flex;
-    }
-    .tab {
-      display: inline-flex;
-      li {
+    margin: -24px;
+    .banner-item {
         position: relative;
-        margin: 0 20px;
-        font-size: 18px;
-        line-height: 25px;
-        color: #0B1D30;
-        cursor: pointer;
-        &:after {
-          content: '';
-          position: absolute;
-          bottom: -10px;
-          left: 50%;
-          width: 53px;
-          height: 4px;
-          transform: translateX(-50%);
+        img {
+            width: 100%;
+            height: 100%;
         }
-        &.active:after {
-          background-color: #007EFF;
+        .banner-name {
+            position: absolute;
+            top: 116px;
+            left: 188px;
+            font-size: 50px;
+            color: #2e2d31;
         }
-      }
     }
-  }
-  .search {
-    position: relative;
-    display: flex;
-    align-items: center;
-    width: 410px;
-    height: 48px;
-    padding: 0 18px;
-    background-color: #fff;
-    border-radius: 31px;
-    input {
-      height: 40px;
-      margin-left: 7px ;
-      font-size: 14px;
-      color: #333;
-      border: 0;
-      outline: none !important;
+    .inner {
+        width: 1146px;
+        margin: 18px auto;
     }
-  }
-  .filter {
-    padding: 5px 30px;
-    background-color: #fff;
-    border-radius: 10px;
-    dl {
-      position: relative;
-      display: flex;
-      flex-wrap: wrap;
-      margin: 20px 0;
-      dt {
-        min-width: 60px;
-        padding: 5px 0;
-        margin-right: 30px;
-        color: #666;
-        font-size: 14px;
-        font-weight: 600;
-        white-space: nowrap;
-      }
-      dd {
-        padding: 5px 15px;
-        color: #333;
-        font-size: 14px;
-        white-space: nowrap;
-        cursor: pointer;
-        &.active {
-          font-weight: 600;
-          color: #007EFF;
+    .typw-wrap {
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 18px;
+        .left {
+            display: inline-flex;
+        }
+        .tab {
+            display: inline-flex;
+            li {
+                position: relative;
+                margin: 0 20px;
+                font-size: 18px;
+                line-height: 25px;
+                color: #0b1d30;
+                cursor: pointer;
+                &:after {
+                    content: '';
+                    position: absolute;
+                    bottom: -10px;
+                    left: 50%;
+                    width: 53px;
+                    height: 4px;
+                    transform: translateX(-50%);
+                }
+                &.active:after {
+                    background-color: #007eff;
+                }
+            }
         }
-      }
     }
-    .vals {
-      display: inline-flex;
-      flex-wrap: wrap;
-      width: 920px;
+    .search {
+        position: relative;
+        display: flex;
+        align-items: center;
+        width: 410px;
+        height: 48px;
+        padding: 0 18px;
+        background-color: #fff;
+        border-radius: 31px;
+        input {
+            height: 40px;
+            margin-left: 7px;
+            font-size: 14px;
+            color: #333;
+            border: 0;
+            outline: none !important;
+        }
     }
-    .caret {
-      position: absolute;
-      top: 4px;
-      left: 250px;
-      width: 20px;
-      height: 20px;
-      cursor: pointer;
-      i {
-        position: absolute;
-        width: 0;
-        height: 0;
-        border: 5px solid transparent;
-      }
-      .asc {
-        top: 0;
-        border-bottom-color: #c0c4cc;
-        &.active {
-          border-bottom-color: #409eff;
+    .filter {
+        padding: 5px 30px;
+        background-color: #fff;
+        border-radius: 10px;
+        dl {
+            position: relative;
+            display: flex;
+            flex-wrap: wrap;
+            margin: 20px 0;
+            dt {
+                min-width: 60px;
+                padding: 5px 0;
+                margin-right: 30px;
+                color: #666;
+                font-size: 14px;
+                font-weight: 600;
+                white-space: nowrap;
+            }
+            dd {
+                padding: 5px 15px;
+                color: #333;
+                font-size: 14px;
+                white-space: nowrap;
+                cursor: pointer;
+                &.active {
+                    font-weight: 600;
+                    color: #007eff;
+                }
+            }
         }
-      }
-      .desc {
-        top: 12px;
-        border-top-color: #c0c4cc;
-        &.active {
-          border-top-color: #409eff;
+        .vals {
+            display: inline-flex;
+            flex-wrap: wrap;
+            width: 920px;
+        }
+        .caret {
+            position: absolute;
+            top: 4px;
+            left: 250px;
+            width: 20px;
+            height: 20px;
+            cursor: pointer;
+            i {
+                position: absolute;
+                width: 0;
+                height: 0;
+                border: 5px solid transparent;
+            }
+            .asc {
+                top: 0;
+                border-bottom-color: #c0c4cc;
+                &.active {
+                    border-bottom-color: #409eff;
+                }
+            }
+            .desc {
+                top: 12px;
+                border-top-color: #c0c4cc;
+                &.active {
+                    border-top-color: #409eff;
+                }
+            }
         }
-      }
-    }
-  }
-  .courses {
-    position: relative;
-    margin-top: 24px;
-    ul {
-      position: relative;
-      display: flex;
-      flex-wrap: wrap;
     }
-    li {
-      position: relative;
-      width: calc((100% - 66px) / 4);
-      min-height: 250px;
-      margin: 0 22px 22px 0;
-      cursor: pointer;
-      border-radius: 10px;
-      background-color: #fff;
-      transition: all 0.3s;
-      overflow: hidden;
-      &:nth-child(4n) {
-        margin-right: 0;
-      }
-      img {
-        width: 100%;
-        height: 140px;
-        transition: .3s;
-      }
-      .my-school {
-        position: absolute;
-        top: 0;
-        right: 0;
-        width: 57px;
-        height: 22px;
-      }
-      .texts {
-        padding: 10px;
-      }
-      .title {
-        margin-bottom: 10px;
-        color: #0B1D30;
-        font-size: 14px;
-        font-weight: 600;
-        word-wrap: break-word;
-        word-break: break-all;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      .desc {
-        min-height: 34px;
-        color: #757F92;
-        font-size: 12px;
-        display: -webkit-box;
-        -webkit-box-orient: vertical;
-        -webkit-line-clamp: 2;
-        overflow: hidden;
-      }
-      .tags {
-        height: 24px;
-        margin-top: 10px;
-        overflow: hidden;
-      }
-      .tag {
-        margin-right: 8px;
-        color: #007EFF;
-        background-color: #F9F9F9;
-        border: 0;
-      }
-      .type {
-        display: inline-block;
-        padding: 4px 11px;
-        font-size: 12px;
-        color: #666;
-        border: 1px solid #DADADA;
-        border-radius: 20px;
-      }
-      .metas {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin-top: 10px;
-        &.not-selected {
-          justify-content: flex-end;
+    .courses {
+        position: relative;
+        margin-top: 24px;
+        ul {
+            position: relative;
+            display: flex;
+            flex-wrap: wrap;
         }
-      }
-      .meta {
-        display: inline-flex;
-        align-items: center;
-        color: #B5BFD5;
-        font-size: 12px;
-        .icon {
-          width: 14px;
-          max-height: 14px;
-          margin-right: 3px;
+        li {
+            position: relative;
+            width: calc((100% - 66px) / 4);
+            min-height: 250px;
+            margin: 0 22px 22px 0;
+            cursor: pointer;
+            border-radius: 10px;
+            background-color: #fff;
+            transition: all 0.3s;
+            overflow: hidden;
+            &:nth-child(4n) {
+                margin-right: 0;
+            }
+            img {
+                width: 100%;
+                height: 140px;
+                transition: 0.3s;
+            }
+            .my-school {
+                position: absolute;
+                top: 0;
+                right: 0;
+                width: 57px;
+                height: 22px;
+            }
+            .texts {
+                padding: 10px;
+            }
+            .title {
+                margin-bottom: 10px;
+                color: #0b1d30;
+                font-size: 14px;
+                font-weight: 600;
+                word-wrap: break-word;
+                word-break: break-all;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            }
+            .desc {
+                min-height: 34px;
+                color: #757f92;
+                font-size: 12px;
+                display: -webkit-box;
+                -webkit-box-orient: vertical;
+                -webkit-line-clamp: 2;
+                overflow: hidden;
+            }
+            .tags {
+                height: 24px;
+                margin-top: 10px;
+                overflow: hidden;
+            }
+            .tag {
+                margin-right: 8px;
+                color: #007eff;
+                background-color: #f9f9f9;
+                border: 0;
+            }
+            .type {
+                display: inline-block;
+                padding: 4px 11px;
+                font-size: 12px;
+                color: #666;
+                border: 1px solid #dadada;
+                border-radius: 20px;
+            }
+            .metas {
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                margin-top: 10px;
+                &.not-selected {
+                    justify-content: flex-end;
+                }
+            }
+            .meta {
+                display: inline-flex;
+                align-items: center;
+                color: #b5bfd5;
+                font-size: 12px;
+                .icon {
+                    width: 14px;
+                    max-height: 14px;
+                    margin-right: 3px;
+                }
+            }
+            &:hover {
+                box-shadow: 0px 5px 12px 4px rgba(142, 123, 253, 0.09), 0px 3px 6px 0px rgba(142, 123, 253, 0.12),
+                    0px 1px 2px -2px rgba(142, 123, 253, 0.16);
+                img {
+                    transform: scale(1.05);
+                }
+            }
         }
-      }
-      &:hover {
-          box-shadow: 0px 5px 12px 4px rgba(142, 123, 253, 0.09), 0px 3px 6px 0px rgba(142, 123, 253, 0.12), 0px 1px 2px -2px rgba(142, 123, 253, 0.16);
-          img {
-            transform: scale(1.05);
-          }
-      }
     }
-  }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/product/show/index.vue b/src/pages/product/show/index.vue
index bed4a6f..4c7f0de 100644
--- a/src/pages/product/show/index.vue
+++ b/src/pages/product/show/index.vue
@@ -2,52 +2,97 @@
   <div class="wrap">
     <div class="inner">
       <div class="top">
-        <div v-if="form.interfaceDiagrams" class="pics">
-          <img v-for="(pic, i) in form.interfaceDiagrams" :key="i" :src="pic" alt="">
+        <div v-if="form.interfaceDiagrams && height"
+             class="pics"
+             :style="{height: form.interfaceDiagrams.length === 1 ? height: 'auto'}">
+          <img v-for="(pic, i) in form.interfaceDiagrams"
+               :key="i"
+               :src="pic"
+               alt="">
         </div>
-        <div class="right">
+        <div class="right"
+             id="fields">
           <h6>{{ form.mall.productName }}</h6>
-          <div v-if="isCourse" class="meta">
+          <div v-if="isCourse"
+               class="meta">
             共 <span class="val">{{ form.numberOfExperimentalItems }}</span> 个实验项目&emsp;&emsp;
             已有 <span class="val">{{ form.goodsRes.learningCount }}</span>人学过
           </div>
-          <div class="des" v-html="form.mall.productIntroduction"></div>
-          <div class="field">适用专业：{{ form.goodsRes.professionalName }}</div>
+          <div class="des"
+               v-html="form.mall.productIntroduction"></div>
           <div class="fields">
-            <div v-if="form.mall.applicationScenario" class="field"><span class="label">适用场景：</span>{{ form.mall.applicationScenario }}</div>
-            <div v-if="form.mall.matchingCourse" class="field"><span class="label">匹配课程：</span>{{ form.mall.matchingCourse }}</div>
-            <div v-if="form.mall.courseHours" class="field"><span class="label">预计课时：</span>{{ form.mall.courseHours }}</div>
-            <div v-if="form.goodsRes.typeName" class="field"><span class="label">产品类型：</span>{{ form.goodsRes.typeName }}</div>
+            <div class="field"><img src="@/assets/img/product/1.png"
+                   alt=""> 适用专业：{{ form.goodsRes.professionalName }}</div>
+            <div v-if="form.mall.applicationScenario"
+                 class="field"><span class="label"><img src="@/assets/img/product/2.png"
+                     alt=""> 适用场景：</span>{{ form.mall.applicationScenario }}</div>
+            <div v-if="form.mall.matchingCourse"
+                 class="field"><span class="label"><img src="@/assets/img/product/3.png"
+                     alt=""> 匹配课程：</span>{{ form.mall.matchingCourse }}</div>
+            <div v-if="form.mall.courseHours"
+                 class="field"><span class="label"><img src="@/assets/img/product/4.png"
+                     alt=""> 预计课时：</span>{{ form.mall.courseHours }}</div>
+            <div v-if="form.goodsRes.typeName"
+                 class="field"><span class="label"><img src="@/assets/img/product/5.png"
+                     alt=""> 产品类型：</span>{{ form.goodsRes.typeName }}</div>
           </div>
-          <button v-if="!form.goodsRes.logoOfOurSchool" class="btn" @click="toTrail">试用体验</button>
-          <button v-else-if="isCourse || withLink" class="btn entry" @click="toStation">进入实验</button>
+          <button v-if="!form.goodsRes.logoOfOurSchool"
+                  class="btn"
+                  @click="toTrail">试用体验</button>
+          <button v-else-if="isCourse || withLink"
+                  class="btn entry"
+                  @click="toStation">进入实验</button>
         </div>
       </div>
       <div class="course">
         <div class="detail">
           <ul class="tab">
-            <li v-for="(tab, i) in tabs" :key="i" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li>
+            <li v-for="(tab, i) in tabs"
+                :key="i"
+                :class="{active: curTab === tab.id}"
+                @click="tabChange(tab)">{{ tab.name }}</li>
           </ul>
           <div class="courses">
             <template v-if="!curTab">
-              <div class="des" v-html="form.mall.detailedIntroduction"></div>
+              <div class="des"
+                   v-html="form.mall.detailedIntroduction"></div>
             </template>
             <template v-else>
-              <div class="chapter" v-for="(item, i) in chapterList" :key="i">
+              <div class="chapter"
+                   v-for="(item, i) in chapterList"
+                   :key="i">
                 <div class="chapterName">{{ item.name }}</div>
-                <div class="section" v-if="item.subsectionList.length">
-                  <div v-for="(section, j) in item.subsectionList" :key="j" @click="toPreview(i, j)">
-                    <div class="sectionName" :title="section.name" :class="{active: curLink === `${item.name}${section.name}`}">
+                <div class="section"
+                     v-if="item.subsectionList.length">
+                  <div v-for="(section, j) in item.subsectionList"
+                       :key="j"
+                       @click="toPreview(i, j)">
+                    <div class="sectionName"
+                         :title="section.name"
+                         :class="{active: curLink === `${item.name}${section.name}`}">
                       <div class="val">
-                        <img v-if="section.fileType === 'pptx'" src="@/assets/img/exts/ppt.png" alt="">
-                        <img v-else-if="section.fileType === 'mp4'" src="@/assets/img/exts/video.png" alt="">
-                        <img v-else-if="section.fileType === 'doc' || section.fileType === 'docx'" src="@/assets/img/exts/word.png" alt="">
-                        <img v-else-if="section.fileType === 'txt'" src="@/assets/img/exts/txt.png" alt="">
-                        <img v-else-if="section.fileType === 'pdf'" src="@/assets/img/exts/pdf.png" alt="">
-                        <img v-else src="@/assets/img/exts/pic.png" alt="">
+                        <img v-if="section.fileType === 'pptx'"
+                             src="@/assets/img/exts/ppt.png"
+                             alt="">
+                        <img v-else-if="section.fileType === 'mp4'"
+                             src="@/assets/img/exts/video.png"
+                             alt="">
+                        <img v-else-if="section.fileType === 'doc' || section.fileType === 'docx'"
+                             src="@/assets/img/exts/word.png"
+                             alt="">
+                        <img v-else-if="section.fileType === 'txt'"
+                             src="@/assets/img/exts/txt.png"
+                             alt="">
+                        <img v-else-if="section.fileType === 'pdf'"
+                             src="@/assets/img/exts/pdf.png"
+                             alt="">
+                        <img v-else
+                             src="@/assets/img/exts/pic.png"
+                             alt="">
                         {{ section.name }}
                       </div>
-                      <i v-if="!form.goodsRes.logoOfOurSchool" class="icon el-icon-lock"></i>
+                      <i v-if="!form.goodsRes.logoOfOurSchool"
+                         class="icon el-icon-lock"></i>
                     </div>
                   </div>
                 </div>
@@ -58,23 +103,33 @@
         <div class="products">
           <h6>热门产品推荐</h6>
           <ul class="product">
-            <li v-for="(item, i) in hots" :key="i" @click="toDetail(item.mallId)">
-              <img :src="item.coverDrawing" alt="" />
-              <img v-if="item.logoOfOurSchool" class="my-school" src="@/assets/img/my-school.png" alt="">
+            <li v-for="(item, i) in hots"
+                :key="i"
+                @click="toDetail(item.mallId)">
+              <img :src="item.coverDrawing"
+                   alt="" />
+              <img v-if="item.logoOfOurSchool"
+                   class="my-school"
+                   src="@/assets/img/my-school.png"
+                   alt="">
               <div class="texts">
                 <div class="title">{{ item.productName }}</div>
-                <div :class="['desc', {'not-tag': !item.tagsName}]" v-html="item.productIntroduction"></div>
-                <div v-if="item.tagsName" class="tags">
-                  <el-tag v-for="(tag, i) in item.tagsName.split(',')" :key="i" class="tag">{{ tag }}</el-tag>
+                <div :class="['desc', {'not-tag': !item.tagsName}]"
+                     v-html="item.productIntroduction"></div>
+                <div v-if="item.tagsName"
+                     class="tags">
+                  <el-tag v-for="(tag, i) in item.tagsName.split(',')"
+                          :key="i"
+                          class="tag">{{ tag }}</el-tag>
                 </div>
                 <div class="metas">
-                  <el-tag
-                    v-if="item.selected"
-                    type="danger"
-                    effect="dark">
+                  <el-tag v-if="item.selected"
+                          type="danger"
+                          effect="dark">
                     官方精选
                   </el-tag>
-                  <div v-if="item.isCourse" class="meta">{{ item.learningCount }}人学过</div>
+                  <div v-if="item.isCourse"
+                       class="meta">{{ item.learningCount }}人学过</div>
                 </div>
               </div>
             </li>
@@ -82,13 +137,22 @@
         </div>
       </div>
     </div>
-    
+
     <!-- 选择链接 -->
-    <el-dialog title="请选择链接" :visible.sync="linkVisible" width="420px" center :close-on-click-modal="false">
-      <div v-if="withLink" class="buy">
-        <div v-for="(link, i) in form.mallNonAssociatedLinks" :key="i" class="link-line">
+    <el-dialog title="请选择链接"
+               :visible.sync="linkVisible"
+               width="420px"
+               center
+               :close-on-click-modal="false">
+      <div v-if="withLink"
+           class="buy">
+        <div v-for="(link, i) in form.mallNonAssociatedLinks"
+             :key="i"
+             class="link-line">
           {{ link.urlName }}：
-          <a class="url" :href="link.url" target="_blank">{{ link.url }}</a>
+          <a class="url"
+             :href="link.url"
+             target="_blank">{{ link.url }}</a>
         </div>
       </div>
     </el-dialog>
@@ -99,412 +163,426 @@
 import Util from "@/libs/util"
 import Setting from "@/setting"
 export default {
-    data() {
-        return {
-          id: this.$route.query.id,
-          curTab: 0,
-          tabs: [
-            {
-              id: 0,
-              name: '详情介绍'
-            },
-          ],
-          form: {
-            classificationIds: [],
-            mall: {},
-            goodsRes: {}
+  data () {
+    return {
+      id: this.$route.query.id,
+      curTab: 0,
+      tabs: [
+        {
+          id: 0,
+          name: '详情介绍'
+        },
+      ],
+      form: {
+        classificationIds: [],
+        mall: {},
+        goodsRes: {}
+      },
+      chapterList: [],
+      hots: [],
+      linkVisible: false,
+      height: ''
+    };
+  },
+  computed: {
+    // 是否没关联产品，并且设置了链接
+    withLink () {
+      const links = this.form.mallNonAssociatedLinks
+      return this.form.mall.isAssociatedProduct && links && links.length
+    },
+    // 课程
+    isCourse () {
+      let id = this.form.classificationIds
+      if (id) {
+        id = id[0]
+        const isCourse = (id == 1 || id == 2) && this.form.mall.isAssociatedProduct === 0
+        this.tabs = [
+          {
+            id: 0,
+            name: '详情介绍'
           },
-          chapterList: [],
-          hots: [],
-          linkVisible: false
-        };
+        ]
+        isCourse && this.tabs.push({
+          id: 1,
+          name: '课程目录'
+        })
+        return isCourse
+      }
+      return false
+    }
+  },
+  mounted () {
+    this.getData()
+    this.getHot()
+  },
+  methods: {
+    // 产品详情
+    getData () {
+      this.$get(`${this.api.detailsOfGoods}?mallId=${this.id}`).then(res => {
+        const e = res.orderDetails
+        // 图片展示封面+界面图
+        e.interfaceDiagrams = [e.mall.coverDrawing]
+        if (e.mall.interfaceDiagram) e.interfaceDiagrams.push(...e.mall.interfaceDiagram.split(',').slice(0, 3))
+        this.form = e
+        this.chapterList = ''
+        e.mall.associatedProduct && this.getChapter()
+        this.$nextTick(() => {
+          this.height = document.querySelector('#fields').clientHeight + 'px'
+        })
+      }).catch(err => { })
     },
-    computed: {
-      // 是否没关联产品，并且设置了链接
-      withLink() {
-        const links = this.form.mallNonAssociatedLinks
-        return this.form.mall.isAssociatedProduct && links && links.length
-      },
-      // 课程
-      isCourse() {
-        let id = this.form.classificationIds
-        if (id) {
-          id = id[0]
-          const isCourse = (id == 1 || id == 2) && this.form.mall.isAssociatedProduct === 0
-          this.tabs = [
-            {
-              id: 0,
-              name: '详情介绍'
-            },
-          ]
-          isCourse && this.tabs.push({
-            id: 1,
-            name: '课程目录'
-          })
-          return isCourse
-        }
-        return false
+    // 获取章节小节
+    async getChapter () {
+      let res = await this.$get(this.api.curriculumChapter + '/' + this.form.mall.associatedProduct)
+      this.chapterList = res.chapterList
+    },
+    // tab切换
+    tabChange ({ id }) {
+      this.curTab = id
+    },
+    // 跳转播放资源
+    toPreview (i, j) {
+      this.form.goodsRes.logoOfOurSchool ?
+        this.$router.push(`/station/preview?courseId=${this.form.mall.associatedProduct}&curriculumName=${this.form.mall.associatedProductName}&mallId=${this.id}&chapter=${i}&section=${j}&admin=1`) :
+        this.toTrail()
+    },
+    // 勾选/取消勾选学习进度
+    studySection (item) {
+      item.whetherToStudyOrNot ?
+        this.$post(`${this.api.deleteLearningProgress}?id=${item.learningProgressId}`).then(res => {
+          this.getChapter()
+        }).catch(res => { }) :
+        this.$post(this.api.saveLearningProgress, {
+          cid: this.form.mall.associatedProduct,
+          projectId: item.projectId,
+        }).then(res => {
+          this.getChapter()
+        }).catch(res => { })
+    },
+    // 跳转试用体验
+    toTrail () {
+      window.open('https://f.wps.cn/g/VekixBcm/')
+    },
+    // 跳转实验台
+    toStation () {
+      if (this.isCourse) { // 如果是课程，直接进入实验台
+        this.$post(`${this.api.addLearningRecord}?mallId=${this.id}`).then(res => {
+          this.$router.push('/station/preview?courseId=' + this.form.mall.associatedProduct + '&curriculumName=' + this.form.mall.associatedProductName + '&mallId=' + this.id)
+        }).catch(res => { })
+      } else if (this.withLink) { // 如果没有绑定产品，并且有设置关联链接，则弹框选择链接
+        this.linkVisible = true
       }
     },
-    mounted() {
+    // 热门产品
+    getHot () {
+      this.$post(this.api.listOfGoods, {
+        hotTag: 1,
+        sort: 1,
+        pageNum: 1,
+        pageSize: 2,
+      }).then(({ page }) => {
+        const list = page.records
+        list.forEach(e => {
+          // 简介去掉标签图片
+          const el = document.createElement('div')
+          el.innerHTML = e.productIntroduction
+          e.productIntroduction = el.innerText
+          const cid = e.classificationId
+          e.isCourse = (cid === 1 || cid === 2) && !e.isAssociatedProduct
+        })
+        this.hots = list
+      }).catch(res => { })
+    },
+    // 跳转详情
+    toDetail (id) {
+      this.$router.push(`show?id=${id}`)
+      this.id = id
       this.getData()
-      this.getHot()
     },
-    methods: {
-      // 产品详情
-      getData() {
-        this.$get(`${this.api.detailsOfGoods}?mallId=${this.id}`).then(res => {
-          const e = res.orderDetails
-          // 图片展示封面+界面图
-          e.interfaceDiagrams = [e.mall.coverDrawing]
-          if (e.mall.interfaceDiagram) e.interfaceDiagrams.push(...e.mall.interfaceDiagram.split(',').slice(0, 3))
-          this.form = e
-          this.chapterList = ''
-          e.mall.associatedProduct && this.getChapter()
-        }).catch(err => {})
-      },
-      // 获取章节小节
-      async getChapter() {
-        let res = await this.$get(this.api.curriculumChapter + '/' + this.form.mall.associatedProduct)
-        this.chapterList = res.chapterList
-      },
-      // tab切换
-      tabChange({ id }) {
-        this.curTab = id
-      },
-      // 跳转播放资源
-      toPreview(i, j) {
-        this.form.goodsRes.logoOfOurSchool ?
-          this.$router.push(`/station/preview?courseId=${this.form.mall.associatedProduct}&curriculumName=${this.form.mall.associatedProductName}&mallId=${this.id}&chapter=${i}&section=${j}`) :
-          this.toTrail()
-      },
-      // 勾选/取消勾选学习进度
-      studySection(item) {
-        item.whetherToStudyOrNot ?
-          this.$post(`${this.api.deleteLearningProgress}?id=${item.learningProgressId}`).then(res => {
-            this.getChapter()
-          }).catch(res => {}) :
-            this.$post(this.api.saveLearningProgress, {
-              cid: this.form.mall.associatedProduct,
-              projectId: item.projectId,
-            }).then(res => {
-              this.getChapter()
-            }).catch(res => {})
-      },
-      // 跳转试用体验
-      toTrail() {
-        window.open('https://f.wps.cn/g/VekixBcm/')
-      },
-      // 跳转实验台
-      toStation() {
-        if (this.isCourse) { // 如果是课程，直接进入实验台
-          this.$post(`${this.api.addLearningRecord}?mallId=${this.id}`).then(res => {
-            this.$router.push('/station/preview?courseId=' + this.form.mall.associatedProduct + '&curriculumName=' + this.form.mall.associatedProductName + '&mallId=' + this.id)
-          }).catch(res => {})
-        } else if (this.withLink) { // 如果没有绑定产品，并且有设置关联链接，则弹框选择链接
-          this.linkVisible = true
-        }
-      },
-      // 热门产品
-      getHot() {
-        this.$post(this.api.listOfGoods, {
-          hotTag: 1,
-          sort: 1,
-          pageNum: 1,
-          pageSize: 2,
-        }).then(({ page }) => {
-          const list = page.records
-          list.forEach(e => {
-            // 简介去掉标签图片
-            const el = document.createElement('div')
-            el.innerHTML = e.productIntroduction
-            e.productIntroduction = el.innerText
-            const cid = e.classificationId
-            e.isCourse = (cid === 1 || cid === 2) && !e.isAssociatedProduct
-          })
-          this.hots = list
-        }).catch(res => {})
-      },
-      // 跳转详情
-      toDetail(id) {
-        this.$router.push(`show?id=${id}`)
-        this.id = id
-        this.getData()
-      },
-    }
+  }
 };
 </script>
 
 <style lang="scss" scoped>
 .wrap {
-  background: #F3F6FA;
-  .inner {
-    width: 1154px;
-    margin: 0 auto;
-  }
-  .top {
-    display: flex;
-    padding: 24px;
-    background-color: #fff;
-    border-radius: 10px;
-    .pics {
-      width: 436px;
-      margin-right: 24px;
-      img {
-        width: 140px;
-        height: 62px;
-        margin-right: 8px;
-        border-radius: 8px;
-        &:first-child {
-          width: 100%;
-          height: 192px;
-          margin-bottom: 12px;
+    background: #f3f6fa;
+    .inner {
+        width: 1154px;
+        margin: 0 auto;
+    }
+    .top {
+        display: flex;
+        padding: 24px;
+        background-color: #fff;
+        border-radius: 10px;
+        .pics {
+            width: 436px;
+            margin-right: 24px;
+            img {
+                width: 140px;
+                height: 62px;
+                margin-right: 8px;
+                border-radius: 8px;
+                &:first-child {
+                    width: 100%;
+                    height: 192px;
+                    margin-bottom: 12px;
+                }
+                &:last-child {
+                    margin-right: 0;
+                }
+                &:only-child {
+                    // max-height: 266px;
+                    // height: auto;
+                    height: 100%;
+                    margin: 0;
+                }
+            }
         }
-        &:last-child {
-          margin-right: 0;
+        .right {
+            width: 646px;
+            overflow: hidden;
+        }
+        h6 {
+            font-size: 24px;
+            font-weight: 600;
+            color: #2e2d31;
+        }
+        .meta {
+            margin: 10px 0;
+            font-size: 12px;
+            color: #2e2d31;
+            .val {
+                color: #007eff;
+            }
+        }
+        .des {
+            margin-bottom: 15px;
+            font-size: 14px;
+            color: #666;
+            line-height: 20px;
+            @include mul-ellipsis(3);
+        }
+        .field {
+            font-size: 14px;
+            color: #2e2d31;
+            .label {
+                color: #333;
+            }
+        }
+        .fields {
+            display: flex;
+            // justify-content: space-between;
+            flex-wrap: wrap;
+            height: 60px;
+            margin: 10px 0 10px;
+            overflow: hidden;
+            .field {
+                margin-right: 40px;
+                margin-bottom: 10px;
+            }
+        }
+        .btn {
+            width: 119px;
+            height: 46px;
+            color: #fff;
+            background: #64c25a;
+            border-radius: 6px;
+            border: 0;
+            cursor: pointer;
+            &:hover {
+                opacity: 0.9;
+            }
+            &:first-child {
+                margin-left: 11px;
+            }
+        }
+        .entry {
+            background: #007eff;
         }
-      }
-    }
-    .right {
-      width: 646px;
-      overflow: hidden;
-    }
-    h6 {
-      font-size: 24px;
-      font-weight: 600;
-      color: #2E2D31;
-    }
-    .meta {
-      margin: 10px 0;
-      font-size: 12px;
-      color: #2E2D31;
-      .val {
-        color: #007EFF;
-      }
-    }
-    .des {
-      margin-bottom: 15px;
-      font-size: 14px;
-      color: #666;
-      line-height: 20px;
-    }
-    .field {
-      font-size: 14px;
-      color: #2E2D31;
-      .label {
-        color: #333;
-      }
-    }
-    .fields {
-      display: flex;
-      justify-content: space-between;
-      flex-wrap: wrap;
-      margin: 10px 0 10px;
-      .field {
-        margin-bottom: 10px;
-      }
-    }
-    .btn {
-      width: 119px;
-      height: 46px;
-      color: #fff;
-      background: #64C25A;
-      border-radius: 6px;
-      border: 0;
-      cursor: pointer;
-      &:hover {
-        opacity: .9;
-      }
-      &:first-child {
-        margin-left: 11px;
-      }
-    }
-    .entry {
-      background: #007EFF;
-    }
-  }
-  .tab {
-    display: inline-flex;
-    margin-left: 10px;
-    li {
-      position: relative;
-      margin-right: 20px;
-      font-size: 18px;
-      line-height: 25px;
-      color: #0B1D30;
-      cursor: pointer;
-      &:after {
-        content: '';
-        position: absolute;
-        bottom: -10px;
-        left: 50%;
-        width: 53px;
-        height: 4px;
-        transform: translateX(-50%);
-      }
-      &.active:after {
-        background-color: #007EFF;
-      }
-    }
-  }
-  .course {
-    display: flex;
-    margin-top: 20px;
-    .detail {
-      width: 835px;
-      padding: 20px 24px;
-      background-color: #fff;
-      border-radius: 10px;
-
-    }
-  }
-  .courses {
-    margin-top: 40px;
-    .chapters{
-        margin-top: 16px;
-        max-height: calc(100% - 53px);
-        overflow: auto;
-    }
-    .chapter{
-        margin-bottom: 20px;
     }
-    .chapterName{
-        padding: 0 12px;
-        margin-bottom: 15px;
-        color: #333;
-        font-size: 14px;
+    .tab {
+        display: inline-flex;
+        margin-left: 10px;
+        li {
+            position: relative;
+            margin-right: 20px;
+            font-size: 18px;
+            line-height: 25px;
+            color: #0b1d30;
+            cursor: pointer;
+            &:after {
+                content: '';
+                position: absolute;
+                bottom: -10px;
+                left: 50%;
+                width: 53px;
+                height: 4px;
+                transform: translateX(-50%);
+            }
+            &.active:after {
+                background-color: #007eff;
+            }
+        }
     }
-    .sectionName{
-        position: relative;
+    .course {
         display: flex;
-        justify-content: space-between;
-        padding: 12px;
-        font-size: 14px;
-        color: #666;
-        cursor: pointer;
-        border-radius: 8px;
-        @include ellipsis;
-        img {
-            margin-right: 8px;
+        margin-top: 20px;
+        .detail {
+            width: 835px;
+            padding: 20px 24px;
+            background-color: #fff;
+            border-radius: 10px;
         }
-        &:hover {
-          color: #007EFF;
-          background: #F6FBFF;
+    }
+    .courses {
+        margin-top: 40px;
+        .chapters {
+            margin-top: 16px;
+            max-height: calc(100% - 53px);
+            overflow: auto;
         }
-        .val {
-          display: inline-flex;
-          align-items: center;
+        .chapter {
+            margin-bottom: 20px;
         }
-        .icon {
-          font-size: 18px;
-          color: #666;
+        .chapterName {
+            padding: 0 12px;
+            margin-bottom: 15px;
+            color: #333;
+            font-size: 14px;
+        }
+        .sectionName {
+            position: relative;
+            display: flex;
+            justify-content: space-between;
+            padding: 12px;
+            font-size: 14px;
+            color: #666;
+            cursor: pointer;
+            border-radius: 8px;
+            @include ellipsis;
+            img {
+                margin-right: 8px;
+            }
+            &:hover {
+                color: #007eff;
+                background: #f6fbff;
+            }
+            .val {
+                display: inline-flex;
+                align-items: center;
+            }
+            .icon {
+                font-size: 18px;
+                color: #666;
+            }
         }
     }
-  }
-  .products {
-    width: 295px;
-    margin-left: 24px;
-    &>h6 {
-      font-size: 14px;
-      color: #0B1D30;
-    }
-  }
-  .product {
-    margin-top: 11px;
-    li {
-      position: relative;
-      margin-bottom: 15px;
-      cursor: pointer;
-      border-radius: 10px;
-      background-color: #fff;
-      transition: all 0.3s;
-      overflow: hidden;
-      img {
-        width: 100%;
-        height: 140px;
-        transition: .3s;
-      }
-      .my-school {
-        position: absolute;
-        top: 0;
-        right: 0;
-        width: 57px;
-        height: 22px;
-      }
-      .texts {
-        padding: 10px;
-      }
-      .title {
-        margin-bottom: 10px;
-        color: #0B1D30;
-        font-size: 14px;
-        font-weight: 600;
-        word-wrap: break-word;
-        word-break: break-all;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      .desc {
-        min-height: 34px;
-        color: #757F92;
-        font-size: 12px;
-        display: -webkit-box;
-        -webkit-box-orient: vertical;
-        -webkit-line-clamp: 2;
-        overflow: hidden;
-        &.not-tag {
-          -webkit-line-clamp: 3;
+    .products {
+        width: 295px;
+        margin-left: 24px;
+        & > h6 {
+            font-size: 14px;
+            color: #0b1d30;
         }
-      }
-      .tags {
-        margin-top: 10px;
-      }
-      .tag {
-        margin-right: 8px;
-        color: #007EFF;
-        background-color: #F9F9F9;
-        border: 0;
-      }
-      .type {
-        display: inline-block;
-        padding: 4px 11px;
-        font-size: 12px;
-        color: #666;
-        border: 1px solid #DADADA;
-        border-radius: 20px;
-      }
-      .metas {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin-top: 10px;
-      }
-      .meta {
-        display: inline-flex;
-        align-items: center;
-        color: #B5BFD5;
-        font-size: 12px;
-        .icon {
-          width: 14px;
-          max-height: 14px;
-          margin-right: 3px;
+    }
+    .product {
+        margin-top: 11px;
+        li {
+            position: relative;
+            margin-bottom: 15px;
+            cursor: pointer;
+            border-radius: 10px;
+            background-color: #fff;
+            transition: all 0.3s;
+            overflow: hidden;
+            img {
+                width: 100%;
+                height: 140px;
+                transition: 0.3s;
+            }
+            .my-school {
+                position: absolute;
+                top: 0;
+                right: 0;
+                width: 57px;
+                height: 22px;
+            }
+            .texts {
+                padding: 10px;
+            }
+            .title {
+                margin-bottom: 10px;
+                color: #0b1d30;
+                font-size: 14px;
+                font-weight: 600;
+                word-wrap: break-word;
+                word-break: break-all;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            }
+            .desc {
+                min-height: 34px;
+                color: #757f92;
+                font-size: 12px;
+                display: -webkit-box;
+                -webkit-box-orient: vertical;
+                -webkit-line-clamp: 2;
+                overflow: hidden;
+                &.not-tag {
+                    -webkit-line-clamp: 3;
+                }
+            }
+            .tags {
+                margin-top: 10px;
+            }
+            .tag {
+                margin-right: 8px;
+                color: #007eff;
+                background-color: #f9f9f9;
+                border: 0;
+            }
+            .type {
+                display: inline-block;
+                padding: 4px 11px;
+                font-size: 12px;
+                color: #666;
+                border: 1px solid #dadada;
+                border-radius: 20px;
+            }
+            .metas {
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                margin-top: 10px;
+            }
+            .meta {
+                display: inline-flex;
+                align-items: center;
+                color: #b5bfd5;
+                font-size: 12px;
+                .icon {
+                    width: 14px;
+                    max-height: 14px;
+                    margin-right: 3px;
+                }
+            }
+            &:hover {
+                box-shadow: 0px 5px 12px 4px rgba(142, 123, 253, 0.09), 0px 3px 6px 0px rgba(142, 123, 253, 0.12),
+                    0px 1px 2px -2px rgba(142, 123, 253, 0.16);
+                img {
+                    transform: scale(1.05);
+                }
+            }
         }
-      }
-      &:hover {
-          box-shadow: 0px 5px 12px 4px rgba(142, 123, 253, 0.09), 0px 3px 6px 0px rgba(142, 123, 253, 0.12), 0px 1px 2px -2px rgba(142, 123, 253, 0.16);
-          img {
-            transform: scale(1.05);
-          }
-      }
     }
-  }
 }
 .link-line {
-  margin: 5px 0;
-  .url {
-    color: #007EFF;
-    text-decoration: underline;
-  }
+    margin: 5px 0;
+    .url {
+        color: #007eff;
+        text-decoration: underline;
+    }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/project/add/index.vue b/src/pages/project/add/index.vue
index b50ce0e..0d0a402 100644
--- a/src/pages/project/add/index.vue
+++ b/src/pages/project/add/index.vue
@@ -1,155 +1,232 @@
 <template>
-    <div ref="main" class="main">
-        <el-form :disabled="isDetail">
-            <el-card shadow="hover" class="m-b-20">
-                <div class="flex-between">
-                    <el-page-header @back="back" content="项目配置"></el-page-header>
-                    <div v-if="!isDetail">
-                        <el-button type="success" @click="save(0)">保存为草稿</el-button>
-                        <el-button type="primary" @click="save(1)">确定并发布</el-button>
-                    </div>
-                </div>
-            </el-card>
+  <div ref="main"
+       class="main">
+    <el-form :disabled="isDetail">
+      <el-card shadow="hover"
+               class="m-b-20">
+        <div class="flex-between">
+          <el-page-header @back="back"
+                          content="项目配置"></el-page-header>
+          <div v-if="!isDetail">
+            <el-button type="success"
+                       @click="save(0)">保存为草稿</el-button>
+            <el-button type="primary"
+                       @click="save(1)">确定并发布</el-button>
+          </div>
+        </div>
+      </el-card>
 
-            <el-card shadow="hover" class="m-b-20">
-                <h6 class="p-title">基本信息</h6>
-                <div>
-                    <el-form label-width="80px" :disabled="isDetail">
-                        <div class="flex">
-                            <el-form-item label="系统">
-                                <el-select v-model="projectManage.systemId" placeholder="请选择" @change="systemChange">
-                                    <el-option
-                                        v-for="item in systemList"
-                                        :key="item.id"
-                                        :label="item.label"
-                                        :value="item.id"
-                                    ></el-option>
-                                </el-select>
-                            </el-form-item>
-                            <el-form-item label="项目名称">
-                                <el-input v-model.trim="projectManage.projectName" placeholder="20个字符以内" @blur="projectNameExistis"></el-input>
-                            </el-form-item>
-                            <el-form-item label="项目权限">
-                                <el-select v-model="projectManage.permissions" placeholder="请选择" @change="permissionChange">
-                                    <el-option label="练习" :value="0"></el-option>
-                                    <el-option label="考核" :value="1"></el-option>
-                                    <el-option label="竞赛" :value="2"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </div>
-                    </el-form>
-                </div>
-            </el-card>
+      <el-card shadow="hover"
+               class="m-b-20">
+        <h6 class="p-title">基本信息</h6>
+        <div>
+          <el-form label-width="80px"
+                   :disabled="isDetail">
+            <div class="flex">
+              <el-form-item label="系统">
+                <el-select v-model="projectManage.systemId"
+                           placeholder="请选择"
+                           @change="systemChange">
+                  <el-option v-for="item in systemList"
+                             :key="item.id"
+                             :label="item.label"
+                             :value="item.id"></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="项目名称">
+                <el-input v-model.trim="projectManage.projectName"
+                          placeholder="20个字符以内"
+                          @blur="projectNameExistis"></el-input>
+              </el-form-item>
+              <el-form-item label="项目权限">
+                <el-select v-model="projectManage.permissions"
+                           placeholder="请选择"
+                           @change="permissionChange">
+                  <el-option label="练习"
+                             :value="0"></el-option>
+                  <el-option label="考核"
+                             :value="1"></el-option>
+                  <el-option label="竞赛"
+                             :value="2"></el-option>
+                </el-select>
+              </el-form-item>
+            </div>
+          </el-form>
+        </div>
+      </el-card>
 
-            <el-card shadow="hover" class="m-b-20">
-                <h6 class="p-title">实验目标</h6>
-                <div>
-                    <el-form label-width="0">
-                        <el-form-item>
-                            <quill :border="true" :readonly="isDetail" v-model="projectManage.experimentTarget" :minHeight="150" :height="150" />
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </el-card>
+      <el-card shadow="hover"
+               class="m-b-20">
+        <h6 class="p-title">实验目标</h6>
+        <div>
+          <el-form label-width="0">
+            <el-form-item>
+              <quill :border="true"
+                     :readonly="isDetail"
+                     v-model="projectManage.experimentTarget"
+                     :minHeight="150"
+                     :height="150" />
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-card>
 
-            <el-card shadow="hover" class="m-b-20">
-                <h6 class="p-title">项目背景</h6>
-                <div>
-                    <el-form label-width="0">
-                        <el-form-item>
-                            <quill :border="true" :readonly="isDetail" v-model="projectManage.experimentDescription" :minHeight="150" :height="150" :index="1" />
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </el-card>
+      <el-card shadow="hover"
+               class="m-b-20">
+        <h6 class="p-title">项目背景</h6>
+        <div>
+          <el-form label-width="0">
+            <el-form-item>
+              <quill :border="true"
+                     :readonly="isDetail"
+                     v-model="projectManage.experimentDescription"
+                     :minHeight="150"
+                     :height="150"
+                     :index="1" />
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-card>
 
-            <el-card shadow="hover" class="m-b-20">
-                <div class="m-b-20 flex-between">
-                    <h6 class="p-title" style="margin-bottom: 0">实验任务</h6>
-                    <div>
-                        <!--<el-button :disabled="isDetail" type="primary" @click="toJudgePoint('home')">进入判分点</el-button>-->
-                    </div>
-                </div>
-                <div class="m-b-20 flex-between">
-                    <div class="flex-center">
-                        <div class="m-r-20" style="color: #f00">项目总分值：100分</div>
-                        <!-- <div>权重&emsp;<div class="dib"><el-input></el-input></div></div> -->
-                    </div>
-                    <div>
-                        <el-button class="m-r-20" type="text" @click="avgDistributionScore">平均分配分值</el-button>
-                        <el-button class="m-r-20" type="text" @click="manualDistributionScore">手动分配分值</el-button>
-                        <span>(待分配分值: {{ handDistributionScore }}/100分)</span>
-                    </div>
-                </div>
-                <el-button type="primary" icon="el-icon-plus" round @click="handleQueryJudgment" style="margin-bottom: 10px">判分点</el-button>
-                <el-button type="primary" icon="el-icon-delete" round @click="batchDeleteProjectJudgment" style="margin-bottom: 10px">批量删除</el-button>
-                <div class="draggable">
-                    <el-table
-                        ref="projectJudgementTable"
-                        :data="projectJudgmentData"
-                        class="table"
-                        stripe
-                        header-align="center"
-                        @selection-change="handleSelectionProjectJudgment"
-                        row-key="judgmentId"
-                        v-loading="listLoading"
-                    >
-                        <el-table-column type="selection" width="55" align="center"></el-table-column>
-                        <el-table-column prop="sort" label="序号" width="80" align="center">
-                            <template slot-scope="scope">
-                                {{ scope.row.sort }}
-                            </template>
-                        </el-table-column>
-                        <el-table-column prop="name" label="判分指标" align="center"></el-table-column>
-                        <el-table-column prop="name" label="判分点名称" align="center"></el-table-column>
-                        <el-table-column label="实验要求" align="center" width="600">
-                            <template slot-scope="scope">
-                                <quill :border="true" :readonly="true" elseRead="true" v-model="scope.row.experimentalRequirements" :minHeight="150" :height="150" :index="2" />
-                            </template>
-                        </el-table-column>
-                        <el-table-column prop="score" label="分数" align="center" width="120">
-                            <template slot-scope="scope">
-                                <!--type="number" @blur="updateProjectJudgment"-->
-                                <el-input v-model.trim="scope.row.score" @input="scoreChange(scope.row, scope.$index,$event)"></el-input>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="操作" width="100" align="center">
-                            <template slot-scope="scope">
-                                <!--<el-button :disabled="isDetail" type="text" style="margin-right: 10px" @click="toJudgePoint('edit', scope.row)">自定义</el-button>-->
-                                <el-button type="text" @click="delJudgePoint(scope.$index)">删除</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </div>
-            </el-card>
+      <el-card shadow="hover"
+               class="m-b-20">
+        <div class="m-b-20 flex-between">
+          <h6 class="p-title"
+              style="margin-bottom: 0">实验任务</h6>
+          <div>
+            <!--<el-button :disabled="isDetail" type="primary" @click="toJudgePoint('home')">进入判分点</el-button>-->
+          </div>
+        </div>
+        <div class="m-b-20 flex-between">
+          <div class="flex-center">
+            <div class="m-r-20"
+                 style="color: #f00">项目总分值：100分</div>
+            <!-- <div>权重&emsp;<div class="dib"><el-input></el-input></div></div> -->
+          </div>
+          <div>
+            <el-button class="m-r-20"
+                       type="text"
+                       @click="avgDistributionScore">平均分配分值</el-button>
+            <el-button class="m-r-20"
+                       type="text"
+                       @click="manualDistributionScore">手动分配分值</el-button>
+            <span>(待分配分值: {{ handDistributionScore }}/100分)</span>
+          </div>
+        </div>
+        <el-button type="primary"
+                   icon="el-icon-plus"
+                   round
+                   @click="handleQueryJudgment"
+                   style="margin-bottom: 10px">判分点</el-button>
+        <el-button type="primary"
+                   icon="el-icon-delete"
+                   round
+                   @click="batchDeleteProjectJudgment"
+                   style="margin-bottom: 10px">批量删除</el-button>
+        <div class="draggable">
+          <el-table ref="projectJudgementTable"
+                    :data="projectJudgmentData"
+                    class="table"
+                    stripe
+                    header-align="center"
+                    @selection-change="handleSelectionProjectJudgment"
+                    row-key="judgmentId"
+                    v-loading="listLoading">
+            <el-table-column type="selection"
+                             width="55"
+                             align="center"></el-table-column>
+            <el-table-column prop="sort"
+                             label="序号"
+                             width="80"
+                             align="center">
+              <template slot-scope="scope">
+                {{ scope.row.sort }}
+              </template>
+            </el-table-column>
+            <el-table-column prop="name"
+                             label="判分指标"
+                             align="center"></el-table-column>
+            <el-table-column prop="name"
+                             label="判分点名称"
+                             align="center"></el-table-column>
+            <el-table-column label="实验要求"
+                             align="center"
+                             width="600">
+              <template slot-scope="scope">
+                <quill :border="true"
+                       :readonly="true"
+                       elseRead="true"
+                       v-model="scope.row.experimentalRequirements"
+                       :minHeight="150"
+                       :height="150"
+                       :index="2" />
+              </template>
+            </el-table-column>
+            <el-table-column prop="score"
+                             label="分数"
+                             align="center"
+                             width="120">
+              <template slot-scope="scope">
+                <!--type="number" @blur="updateProjectJudgment"-->
+                <el-input v-model.trim="scope.row.score"
+                          @input="scoreChange(scope.row, scope.$index,$event)"></el-input>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作"
+                             width="100"
+                             align="center">
+              <template slot-scope="scope">
+                <!--<el-button :disabled="isDetail" type="text" style="margin-right: 10px" @click="toJudgePoint('edit', scope.row)">自定义</el-button>-->
+                <el-button type="text"
+                           @click="delJudgePoint(scope.$index)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </el-card>
 
-            <el-card shadow="hover" class="m-b-20">
-                <div class="m-b-20 flex-between">
-                    <h6 class="p-title" style="margin-bottom: 0">实验提示</h6>
-                    <div>
-                        启用
-                        <el-switch :active-value="0" :inactive-value="1" v-model="projectManage.hintOpen"></el-switch>
-                    </div>
-                </div>
-                <div>
-                    <el-form label-width="0">
-                        <el-form-item prop="tips" label="">
-                            <quill :border="true" :readonly="isDetail" v-model="projectManage.experimentHint" :minHeight="150" :height="150" :index="3" />
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </el-card>
-        </el-form>
+      <el-card shadow="hover"
+               class="m-b-20">
+        <div class="m-b-20 flex-between">
+          <h6 class="p-title"
+              style="margin-bottom: 0">实验提示</h6>
+          <div>
+            启用
+            <el-switch :active-value="0"
+                       :inactive-value="1"
+                       v-model="projectManage.hintOpen"></el-switch>
+          </div>
+        </div>
+        <div>
+          <el-form label-width="0">
+            <el-form-item prop="tips"
+                          label="">
+              <quill :border="true"
+                     :readonly="isDetail"
+                     v-model="projectManage.experimentHint"
+                     :minHeight="150"
+                     :height="150"
+                     :index="3" />
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-card>
+    </el-form>
 
-        <!--选择判分点对话框-->
-        <el-dialog title="添加判分点" :visible.sync="dialogVisible" width="40%" :close-on-click-modal="false">
-            <div class="text-right m-b-10">
-                <div>
-                    <el-input placeholder="请输入需要查找的判分点" prefix-icon="el-icon-search" v-model.trim="judgementpointsquery" clearable></el-input>
-                </div>
-            </div>
-            <el-table
-                v-loading="visibleLoading"
+    <!--选择判分点对话框-->
+    <el-dialog title="添加判分点"
+               :visible.sync="dialogVisible"
+               width="40%"
+               :close-on-click-modal="false">
+      <div class="text-right m-b-10">
+        <div>
+          <el-input placeholder="请输入需要查找的判分点"
+                    prefix-icon="el-icon-search"
+                    v-model.trim="judgementpointsquery"
+                    clearable></el-input>
+        </div>
+      </div>
+      <el-table v-loading="visibleLoading"
                 :data="judgementData"
                 ref="judgementTable"
                 class="table"
@@ -157,27 +234,39 @@
                 header-align="center"
                 max-height="400"
                 @selection-change="handleSelectionJudgment"
-                :row-key="rowKey"
-            >
-                <el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column>
-                <el-table-column prop="id" label="序号" align="center" width="100">
-                    <template slot-scope="scope">
-                        {{ scope.$index + 1 }}
-                    </template>
-                </el-table-column>
-                <el-table-column prop="name" label="判分点名称" align="center"></el-table-column>
-                <el-table-column label="操作" align="center" width="100">
-                    <template slot-scope="scope">
-                        <el-button size="mini" @click="toJudgePoint('view', scope.row)">查看</el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div slot="footer" class="dialog-footer">
-                <el-button @click="dialogVisible = false">取 消</el-button>
-                <el-button type="primary" @click="addJudgment">确 定</el-button>
-            </div>
-        </el-dialog>
-    </div>
+                :row-key="rowKey">
+        <el-table-column type="selection"
+                         width="55"
+                         align="center"
+                         :reserve-selection="true"></el-table-column>
+        <el-table-column prop="id"
+                         label="序号"
+                         align="center"
+                         width="100">
+          <template slot-scope="scope">
+            {{ scope.$index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="name"
+                         label="判分点名称"
+                         align="center"></el-table-column>
+        <el-table-column label="操作"
+                         align="center"
+                         width="100">
+          <template slot-scope="scope">
+            <el-button size="mini"
+                       @click="toJudgePoint('view', scope.row)">查看</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div slot="footer"
+           class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary"
+                   @click="addJudgment">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
@@ -188,536 +277,536 @@ import quill from "@/components/quill";
 import Sortable from "sortablejs";
 
 export default {
-    components: {
-        quill
-    },
-    data() {
-        return {
-            projectId: this.$route.query.projectId,
-            founder: this.$route.query.founder,
-            systemList: [],
-            token: btoa(util.local.get(Setting.tokenKey)),
-            isDetail: Boolean(this.$route.query.show),
+  components: {
+    quill
+  },
+  data () {
+    return {
+      projectId: this.$route.query.projectId,
+      founder: this.$route.query.founder,
+      systemList: [],
+      token: btoa(util.local.get(Setting.tokenKey)),
+      isDetail: Boolean(this.$route.query.show),
 
-            projectManage: {
-                founder: 1, // 创建人角色(0、系统 1、老师)
-                projectName: "", // 项目名称
-                permissions: 0, // 项目权限(0、练习 1、考核 2、竞赛)
-                systemId: this.$store.state.project.lastSystemId, // 系统id
-                hintOpen: 0, // 实验提示是否开启(0开启 1不开启 默认0)
-                experimentHint: "", // 实验提示
-                experimentTarget: "", // 实验目标
-                experimentDescription: "", // 项目背景
-                state: 0, // 状态(0、草稿箱 1、已发布)
-                isOpen: 0, // 是否开启(0开启 1未开启 默认0)
-                isDel: 0 // 是否删除(0、未删除 1、已删除 默认0)
-            },
-            projectJudgmentData: [], //实验任务(项目判分点)
-            selectedProjectJudgment: [], // 选中的项目判分点
+      projectManage: {
+        founder: 1, // 创建人角色(0、系统 1、老师)
+        projectName: "", // 项目名称
+        permissions: 0, // 项目权限(0、练习 1、考核 2、竞赛)
+        systemId: this.$store.state.project.lastSystemId, // 系统id
+        hintOpen: 0, // 实验提示是否开启(0开启 1不开启 默认0)
+        experimentHint: "", // 实验提示
+        experimentTarget: "", // 实验目标
+        experimentDescription: "", // 项目背景
+        state: 0, // 状态(0、草稿箱 1、已发布)
+        isOpen: 0, // 是否开启(0开启 1未开启 默认0)
+        isDel: 0 // 是否删除(0、未删除 1、已删除 默认0)
+      },
+      projectJudgmentData: [], //实验任务(项目判分点)
+      selectedProjectJudgment: [], // 选中的项目判分点
 
-            dialogVisible: false, // 选择判分点对话框
-            judgementpointsquery: "", //条件筛选判分点
-            judgementData: [], // 判分点列表数据
-            selectedJudgment: [], // 选中的判分点
-            rowKey: "", // 判分点行数据的 Key
-            projectNameRepeat: false, // 项目名称是否重复
-            originName: '',
+      dialogVisible: false, // 选择判分点对话框
+      judgementpointsquery: "", //条件筛选判分点
+      judgementData: [], // 判分点列表数据
+      selectedJudgment: [], // 选中的判分点
+      rowKey: "", // 判分点行数据的 Key
+      projectNameRepeat: false, // 项目名称是否重复
+      originName: '',
 
-            flag: false, //判分点表格分数是否禁用
-            avgValuelist: [], //取得判分点平均分的数组
+      flag: false, //判分点表格分数是否禁用
+      avgValuelist: [], //取得判分点平均分的数组
 
-            searchTimer: null,
-            isToPoint: false, // 判断是否是跳转到判分点系统
-            visibleLoading: false, // 加载弹框
-            listLoading:false,// 列表加载
-            submiting: false, // 新增编辑员工防抖标识
-            updateTime: 0,
-            next: null,
-            backType: false
-        };
+      searchTimer: null,
+      isToPoint: false, // 判断是否是跳转到判分点系统
+      visibleLoading: false, // 加载弹框
+      listLoading: false,// 列表加载
+      submiting: false, // 新增编辑员工防抖标识
+      updateTime: 0,
+      next: null,
+      backType: false
+    };
+  },
+  computed: {
+    ...mapState("project", [
+      "projectFields", "lastSystemId"
+    ]),
+    handDistributionScore: function () {
+      //计算判分点分值，超出100提示，
+      let score = 0;
+      this.projectJudgmentData.forEach(e => {
+        score += parseInt(e.score);
+      });
+      if (isNaN(score)) {
+        return 0;
+      }
+      if (score > 100) {
+        // util.errorMsg(res.message);
+        util.errorMsg("分配的数值已超过100");
+      }
+      console.log("chuli");
+      return score;
+    }
+  },
+  watch: {
+    // 监听信息是否有更改,有的话页面离开的时候要询问是否要保存
+    projectManage: {
+      handler () {
+        this.updateTime++
+      },
+      deep: true
     },
-    computed: {
-        ...mapState("project", [
-            "projectFields", "lastSystemId"
-        ]),
-        handDistributionScore: function() {
-            //计算判分点分值，超出100提示，
-            let score = 0;
-            this.projectJudgmentData.forEach(e => {
-                score += parseInt(e.score);
-            });
-            if (isNaN(score)) {
-                return 0;
-            }
-            if (score > 100) {
-                // util.errorMsg(res.message);
-                util.errorMsg("分配的数值已超过100");
-            }
-            console.log("chuli");
-            return score;
-        }
+    judgementpointsquery (n) {
+      clearTimeout(this.searchTimer);
+      this.searchTimer = setTimeout(() => {
+        this.handleQueryJudgment();
+      }, 500);
+    }
+  },
+  // 离开的时候判断是否有保存更改的信息,没有则拦截并提示
+  beforeRouteLeave (to, from, next) {
+    console.log(44, this.updateTime)
+    if (this.updateTime) {
+      if (!this.backType) {
+        this.$confirm(`您所更改的内容未更新，是否更新？`, '提示', {
+          type: 'warning'
+        }).then(() => {
+          this.next = next
+          this.save(this.projectManage.state)
+        }).catch(() => {
+          next()
+        })
+      } else {
+        next()
+      }
+
+    } else {
+      next()
+    }
+  },
+  mounted () {
+    this.getSystemData();
+    if (this.$route.query.projectId) {
+      this.projectId = this.$route.query.projectId;
+      this.getInfoData();
+    }
+    // 判断有没有缓存数据
+    if (JSON.stringify(this.projectFields) != "{}") {
+      let { projectManage, projectJudgmentData } = this.projectFields;
+      this.projectManage = projectManage;
+      this.projectJudgmentData = projectJudgmentData;
+    }
+    this.rowDrop();
+    this.$refs.main.scrollTop = 0;
+  },
+  beforeDestroy () {
+    if (!this.isToPoint) {
+      this.setProject({});
+    }
+  },
+  methods: {
+    ...mapActions("project", [
+      "setSystemId", "setProject"
+    ]),
+    getSystemData () {
+      this.$get(this.api.getSystemIdBySchool).then(res => {
+        this.systemList = res.data;
+      });
     },
-    watch: {
-      // 监听信息是否有更改,有的话页面离开的时候要询问是否要保存
-      projectManage: {
-        handler(){
-          this.updateTime++
-        },
-        deep:true
-      },
-      judgementpointsquery(n) {
-          clearTimeout(this.searchTimer);
-          this.searchTimer = setTimeout(() => {
-              this.handleQueryJudgment();
-          }, 500);
+    getInfoData () { // 获取详情数据
+      this.$get(`${this.api.getProjectDetail}?projectId=${this.projectId}`).then(res => {
+        let { projectManage, projectJudgmentVos } = res;
+        this.projectManage = projectManage;
+        this.originName = projectManage.projectName
+        this.projectJudgmentData = projectJudgmentVos;
+        this.projectJudgmentData.forEach((e, i) => {
+          e.sort = i + 1;
+        });
+        this.$nextTick(() => {
+          this.$refs.main.scrollTop = 0;
+          this.updateTime = 0
+        });
+      }).catch(err => {
+        console.log(err);
+      });
+    },
+    projectNameExistis () { // 项目管理名称判重
+      const { projectName } = this.projectManage
+      if (this.originName === projectName) {
+        this.projectNameRepeat = false
+      } else {
+        this.$post(this.api.queryNameIsExist, { projectName }).then(res => {
+          if (res.status === 200) {
+            this.projectNameRepeat = false
+          }
+        }).catch(err => {
+          this.projectNameRepeat = true
+        })
       }
     },
-    // 离开的时候判断是否有保存更改的信息,没有则拦截并提示
-    beforeRouteLeave(to, from, next) {
-      console.log(44, this.updateTime)
-        if(this.updateTime){
-            if(!this.backType) {
-                this.$confirm(`您所更改的内容未更新，是否更新？`, '提示', {
-                    type: 'warning'
-                }).then(() => {
-                    this.next = next
-                    this.save(this.projectManage.state)
-                }).catch(() => {
-                    next()
-                })
-            }else {
-                next()
-            }
-           
-        }else{
-            next()
-        }
+    systemChange () { // 切换系统
+      if (this.projectJudgmentData.length) {
+        this.$confirm("更换系统会清空实验任务，确认更换？", "提示", {
+          type: "warning"
+        }).then(() => {
+          this.projectJudgmentData = [];
+          this.setSystemId(this.projectManage.systemId);
+        }).catch(() => {
+          this.projectManage.systemId = this.lastSystemId;
+          // console.log(this.lastSystemId, "this.lastSystemId");
+        });
+      }
+    },
+    // 去除空白标签
+    removeTag (val) {
+      return val.replace('<p><br></p>', '')
     },
-    mounted() {
-        this.getSystemData();
-        if (this.$route.query.projectId) {
-            this.projectId = this.$route.query.projectId;
-            this.getInfoData();
+    judgmentRelease (state) { //判断能否成功发布
+      let {
+        projectName,
+        experimentTarget,
+        experimentDescription,
+        experimentHint,
+        hintOpen
+      } = this.projectManage;
+      if (!projectName) {
+        util.errorMsg("请输入项目名称");
+        return false;
+      }
+      if (this.projectNameRepeat) {
+        util.errorMsg("项目名称重复!");
+        return false;
+      }
+      if (state) {
+        if (!experimentTarget || !this.removeTag(experimentTarget)) {
+          util.errorMsg("请输入实验目标");
+          return false;
         }
-        // 判断有没有缓存数据
-        if (JSON.stringify(this.projectFields) != "{}") {
-            let { projectManage, projectJudgmentData } = this.projectFields;
-            this.projectManage = projectManage;
-            this.projectJudgmentData = projectJudgmentData;
+        if (!experimentDescription || !this.removeTag(experimentDescription)) {
+          util.errorMsg("请输入案例描述");
+          return false;
         }
-        this.rowDrop();
-        this.$refs.main.scrollTop = 0;
-    },
-    beforeDestroy() {
-        if (!this.isToPoint) {
-            this.setProject({});
+        if (this.projectJudgmentData.length == 0) {
+          util.errorMsg("请添加判分点");
+          return false;
+        }
+        if (this.handDistributionScore < 100) {
+          util.errorMsg("判分点分数未满100");
+          return false;
+        }
+        if (this.handDistributionScore > 100) {
+          util.errorMsg("判分点分数已超过100");
+          return false;
         }
+        if ((!experimentHint || !this.removeTag(experimentHint)) && hintOpen == 0) {
+          util.errorMsg("请输入实验提示");
+          return false;
+        }
+      }
+      return true;
     },
-    methods: {
-        ...mapActions("project", [
-            "setSystemId", "setProject"
-        ]),
-        getSystemData() {
-            this.$get(this.api.getSystemIdBySchool).then(res => {
-                this.systemList = res.data;
-            });
-        },
-        getInfoData() { // 获取详情数据
-            this.$get(`${this.api.getProjectDetail}?projectId=${this.projectId}`).then(res => {
-                let { projectManage, projectJudgmentVos } = res;
-                this.projectManage = projectManage;
-                this.originName = projectManage.projectName
-                this.projectJudgmentData = projectJudgmentVos;
-                this.projectJudgmentData.forEach((e, i) => {
-                    e.sort = i + 1;
-                });
-                this.$nextTick(() => {
-                    this.$refs.main.scrollTop = 0;
-                    this.updateTime = 0
-                });
-            }).catch(err => {
-                console.log(err);
-            });
-        },
-        projectNameExistis() { // 项目管理名称判重
-          const { projectName } = this.projectManage
-          if (this.originName === projectName) {
-            this.projectNameRepeat = false
-          } else {
-            this.$post(this.api.queryNameIsExist, { projectName }).then(res => {
-              if (res.status === 200) {
-                this.projectNameRepeat = false
-              }
-            }).catch(err => {
-              this.projectNameRepeat = true
-            })
-          }
-        },
-        systemChange() { // 切换系统
-            if (this.projectJudgmentData.length) {
-                this.$confirm("更换系统会清空实验任务，确认更换？", "提示", {
-                    type: "warning"
-                }).then(() => {
-                    this.projectJudgmentData = [];
-                    this.setSystemId(this.projectManage.systemId);
-                }).catch(() => {
-                    this.projectManage.systemId = this.lastSystemId;
-                    // console.log(this.lastSystemId, "this.lastSystemId");
-                });
-            }
-        },
-        // 去除空白标签
-        removeTag(val) {
-          return val.replace('<p><br></p>', '')
-        },
-        judgmentRelease(state) { //判断能否成功发布
-            let {
-                projectName,
-                experimentTarget,
-                experimentDescription,
-                experimentHint,
-                hintOpen
-            } = this.projectManage;
-            if (!projectName) {
-                util.errorMsg("请输入项目名称");
-                return false;
-            }
-            if (this.projectNameRepeat) {
-                util.errorMsg("项目名称重复!");
-                return false;
-            }
-            if (state) {
-              if (!experimentTarget || !this.removeTag(experimentTarget)) {
-                  util.errorMsg("请输入实验目标");
-                  return false;
-              }
-              if (!experimentDescription || !this.removeTag(experimentDescription)) {
-                  util.errorMsg("请输入案例描述");
-                  return false;
-              }
-              if (this.projectJudgmentData.length == 0) {
-                  util.errorMsg("请添加判分点");
-                  return false;
-              }
-              if (this.handDistributionScore < 100) {
-                  util.errorMsg("判分点分数未满100");
-                  return false;
-              }
-              if (this.handDistributionScore > 100) {
-                  util.errorMsg("判分点分数已超过100");
-                  return false;
-              }
-              if ((!experimentHint || !this.removeTag(experimentHint)) && hintOpen == 0) {
-                  util.errorMsg("请输入实验提示");
-                  return false;
-              }
-            }
-            return true;
-        },
-        save(state) { //处理提交
-            if (this.submiting) return false
-            if (!this.judgmentRelease(state)) { //判断页面是否有没有输入的内容
-                return;
-            }
-            this.submiting = true
-            this.setSystemId(this.projectManage.systemId);
-            this.projectManage.state = state;
-            let { systemId } = this.projectManage;
-            if (this.projectId) {
-                if (systemId == 2 || systemId == 3) {
-                    console.log("系统id：", systemId);
-                } else {
-                    // 更新
-                    this.updateProjectJudgment();
-                }
-            } else {
-                if (systemId == 2 || systemId == 3) {
-                    console.log("系统id：", systemId);
-                } else {
-                    // 添加
-                    let tempArr = this.projectJudgmentData.map(i => {
-                        let obj = {
-                            projectId: this.projectId ? this.projectId : "",
-                            judgmentId: i.judgmentId,
-                            score: i.score,
-                            sort: i.sort
-                        };
-                        return obj;
-                    });
+    save (state) { //处理提交
+      if (this.submiting) return false
+      if (!this.judgmentRelease(state)) { //判断页面是否有没有输入的内容
+        return;
+      }
+      this.submiting = true
+      this.setSystemId(this.projectManage.systemId);
+      this.projectManage.state = state;
+      let { systemId } = this.projectManage;
+      if (this.projectId) {
+        if (systemId == 2 || systemId == 3) {
+          console.log("系统id：", systemId);
+        } else {
+          // 更新
+          this.updateProjectJudgment();
+        }
+      } else {
+        if (systemId == 2 || systemId == 3) {
+          console.log("系统id：", systemId);
+        } else {
+          // 添加
+          let tempArr = this.projectJudgmentData.map(i => {
+            let obj = {
+              projectId: this.projectId ? this.projectId : "",
+              judgmentId: i.judgmentId,
+              score: i.score,
+              sort: i.sort
+            };
+            return obj;
+          });
 
-                    let params = {
-                        projectManage: this.projectManage,
-                        projectJudgmentList: tempArr
-                    };
-                    this.addProject(params);
-                }
-            }
-        },
-        updateProject(params) { // 更新项目
-            this.$post(this.api[params.projectManage.state ? 'updateProjectManage' : 'editProjectDraft'], params).then(res => {
-                util.successMsg("更新实验项目成功");
-                this.updateTime = 0
-                this.next ? this.next() : this.$router.back();
-            }).catch(err => {
-                this.submiting = false
-            });
-        },
-        addProject(params) { // 添加项目
-            console.log("🚀 ~ file: index.vue ~ line 448 ~ addProject ~ params", params)
-            this.$post(this.api[params.projectManage.state ? 'addProjectManage' : 'saveProjectDraft'], params).then(res => {
-                util.successMsg("添加实验项目成功");
-                this.updateTime = 0
-                this.next ? this.next() : this.$router.back();
-            }).catch(err => {
-                this.submiting = false
-            });
-        },
-        manualDistributionScore() { //点击手动分配分值
+          let params = {
+            projectManage: this.projectManage,
+            projectJudgmentList: tempArr
+          };
+          this.addProject(params);
+        }
+      }
+    },
+    updateProject (params) { // 更新项目
+      this.$post(this.api[params.projectManage.state ? 'updateProjectManage' : 'editProjectDraft'], params).then(res => {
+        util.successMsg("更新实验项目成功");
+        this.updateTime = 0
+        this.next ? this.next() : this.$router.back();
+      }).catch(err => {
+        this.submiting = false
+      });
+    },
+    addProject (params) { // 添加项目
+      console.log("🚀 ~ file: index.vue ~ line 448 ~ addProject ~ params", params)
+      this.$post(this.api[params.projectManage.state ? 'addProjectManage' : 'saveProjectDraft'], params).then(res => {
+        util.successMsg("添加实验项目成功");
+        this.updateTime = 0
+        this.next ? this.next() : this.$router.back();
+      }).catch(err => {
+        this.submiting = false
+      });
+    },
+    manualDistributionScore () { //点击手动分配分值
 
-        },
-        avgDistributionScore() {
-            //点击平均分配分值
-            if (this.projectJudgmentData.length) {
-                this.$get(this.api.avgValues, {
-                    number: this.projectJudgmentData.length
-                }).then(res => {
-                    if (res.data) {
-                        this.projectJudgmentData = this.projectJudgmentData.map((item, index) => {
-                            item.score = res.data[index];
-                            return item;
-                        });
-                        // this.updateProjectJudgment();
-                    }
-                });
-            }
-        },
-        scoreChange(row, index, val) { // 暂时解决，输入分数，页面没有更新
-            this.projectJudgmentData.splice(index, 1, row);
-        },
-        delJudgePoint(index) { // 删除判分点
-            this.$confirm("确定要删除吗？", "提示", {
-                type: "warning"
-            }).then(() => {
-                this.projectJudgmentData.splice(index, 1);
-            }).catch(() => {
-            });
-        },
-        handleSelectionProjectJudgment(val) {
-            this.selectedProjectJudgment = val;
-        },
-        batchDeleteProjectJudgment() { // 批量删除判分点
-            if (this.selectedProjectJudgment.length) {
-                this.$confirm("确定要删除吗？", "提示", {
-                    type: "warning"
-                }).then(() => {
-                    let list = this.projectJudgmentData;
-                    let result = [];
-                    list.map(i => {
-                        this.selectedProjectJudgment.find(j => j.judgmentId === i.judgmentId) || result.push(i);
-                    });
-                    this.projectJudgmentData = result;
-                }).catch(() => {
-                });
-            } else {
-                util.errorMsg("请选择判分点");
-            }
-        },
-        handleQueryJudgment() { // 查询判分点数据
-            let { systemId } = this.projectManage;
-            this.dialogVisible = true;
-            this.$nextTick(() => {
-                this.$refs.judgementTable.clearSelection();
-            });
-            let params = {
-                systemId,
-                name: this.judgementpointsquery
-            };
-            if (systemId == 2 || systemId == 3) {
-                console.log("系统id：", systemId);
-            } else if (systemId == 11 || systemId == 12) {
-                // (流程)交易类
-                this.rowKey = "lcId";
-                this.getProcessClassData(params);
-            } else {
-                // 编程类
-                this.rowKey = "bcId";
-                this.getProgrammingClassData(params);
-            }
-        },
-        getProcessClassData(params) { // 获取流程类判分点列表数据
-            this.visibleLoading = true;
-            this.$get(`${this.api.getBcJudgmentPoint}`, params).then(res => {
-                let list = res.judgmentPoints
-                let result = [];
-                list.map(i => {
-                    this.projectJudgmentData.find(j => j.judgmentId === i.judgmentId) || result.push(i);
-                });
-                this.visibleLoading = false;
-                this.judgementData = result;
-            }).catch(err => {
-              this.visibleLoading = false
-            });
-        },
-        getProgrammingClassData(params) { // 获取编程类判分点列表数据
-            this.visibleLoading = true;
-            this.$get(this.api.getBcJudgmentPoint, params).then(res => {
-                let list = res.judgmentPoints
-                let result = [];
-                list.map(i => {
-                    this.projectJudgmentData.find(j => j.judgmentId === i.judgmentId) || result.push(i);
-                });
-                this.visibleLoading = false;
-                this.judgementData = result;
-            }).catch(err => {
-              this.visibleLoading = false
-            });
-        },
-        handleSelectionJudgment(val) { // 处理多选判分点
-            this.selectedJudgment = val;
-        },
-        addJudgment() { // 确认选择判分点
-            if (this.selectedJudgment.length) {
-                // console.log(this.selectedJudgment, "queren");
-                this.dialogVisible = false;
-                let tempArr = this.selectedJudgment.map(i => {
-                    i.score = 0;
-                    return i;
-                });
-                this.projectJudgmentData = this.projectJudgmentData.concat(tempArr);
-                this.projectJudgmentData.map((e, i) => {
-                    e.sort = i + 1;
-                });
-                this.$nextTick(() => {
-                    this.$refs.projectJudgementTable.clearSelection();
-                });
-            } else {
-                util.errorMsg("请选择判分点");
-            }
-        },
-        handleCacheData() { // 处理缓存数据
-            this.isToPoint = true;
-            this.setProject({ projectManage: this.projectManage, projectJudgmentData: this.projectJudgmentData });
-        },
-        toJudgePoint(type, row) { // 进入判分点系统
-            this.handleCacheData();
-            let jumpPath = Setting.jumpPath;
-            // let jumpPath = "http://192.168.31.154:8087/"; // 本地
-            let { systemId } = this.projectManage;
-            let href = "";
-            if (type === "view") {
-                // 查看
-                if (systemId == 2) {
-                    console.log(systemId);
-                } else if (systemId == 3) {
-                    console.log(systemId);
-                } else if (systemId == 11 || systemId == 12) {
-                    // 交易类判分点（银行综合系统）
-                    href = `${jumpPath}#/Transaction?isView=true&systemId=${systemId}&lcId=${row.judgmentId}&token=${this.token}&referrer=${window.btoa(location.href)}`;
-                } else {
-                    // 编程类判分点（python子系统）
-                    href = `${jumpPath}#/program?isView=true&systemId=${systemId}&bcId=${row.judgmentId}&token=${this.token}&referrer=${window.btoa(location.href)}`;
-                }
-            } else if (type === "edit") {
-                // 自定义（老师端隐藏此功能）
-                if (systemId == 2) {
-                    console.log(systemId);
-                } else if (systemId == 3) {
-                    console.log(systemId);
-                } else if (systemId == 11 || systemId == 12) {
-                    // 交易类判分点（银行综合系统）
-                    href = `${jumpPath}#/Transaction?isEdit=true&systemId=${systemId}&lcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
-                } else {
-                    // 编程类判分点（python子系统）
-                    href = `${jumpPath}#/program?isEdit=true&systemId=${systemId}&bcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
-                }
-            } else if (type === "home") {
-                if (systemId == 2 || systemId == 3) {
-                    console.log(systemId);
-                } else {
-                    // 进入判分点系统首页（老师端隐藏此功能）
-                    href = `${jumpPath}#/?systemId=${systemId}&token=${this.token}&referrer=${btoa(location.href)}`;
-                }
-            }
-            location.href = href;
-        },
-        permissionChange(){
-            if (this.projectManage.permissions){
-                this.projectManage.hintOpen = 1
-            }else{
-                this.projectManage.hintOpen = 0
-            }
-        },
-        // 行拖拽
-        rowDrop() {
-            // 此时找到的元素是要拖拽元素的父容器
-            const tbody = document.querySelector(".draggable .el-table__body-wrapper tbody");
-            const _this = this;
-            Sortable.create(tbody, {
-                //  指定父元素下可被拖拽的子元素
-                draggable: ".draggable .el-table__row",
-                onEnd({ newIndex, oldIndex }) {
-                    _this.projectJudgmentData.splice(newIndex, 0, _this.projectJudgmentData.splice(oldIndex, 1)[0]);
-                    let newArray = _this.projectJudgmentData.slice(0);
-                    _this.projectJudgmentData = [];
-                    _this.$nextTick(function () {
-                        newArray.forEach((e, i) => {
-                            _this.$set(e, "sort", i + 1);// 不更新
-                            _this.$set(e, "name", e.name + "?");
-                            _this.$set(e, "name", e.name.slice(0, e.name.length - 1)); // 不更新的解决方案
-                        });
-                        _this.projectJudgmentData = newArray;
-                    });
-                }
-            });
-        },
-        // 修改判分点中间表
-        async updateProjectJudgment() {
-            let param = this.projectJudgmentData.map((e, i) => {
-                let obj = {
-                    judgmentId: e.judgmentId,
-                    projectId: this.projectId || "",
-                    score: e.score,
-                    sort: i + 1,
-                    id: e.id
-                };
-                return obj;
-            });
-            await this.$post(`${this.api.updateProjectJudgment}?projectId=${this.projectId}`, param).then(res => {
-                let tempArr = this.projectJudgmentData.map(i => {
-                    let obj = {
-                        projectId: this.projectId ? this.projectId : "",
-                        judgmentId: i.judgmentId,
-                        score: i.score,
-                        sort: i.sort
-                    };
-                    return obj;
-                });
-                let params = {
-                    projectManage: this.projectManage,
-                    projectJudgmentList: tempArr
-                };
-                this.updateProject(params);
-            }).catch(err => {
-                console.log(err);
+    },
+    avgDistributionScore () {
+      //点击平均分配分值
+      if (this.projectJudgmentData.length) {
+        this.$get(this.api.avgValues, {
+          number: this.projectJudgmentData.length
+        }).then(res => {
+          if (res.data) {
+            this.projectJudgmentData = this.projectJudgmentData.map((item, index) => {
+              item.score = res.data[index];
+              return item;
             });
-        },
-        // 返回
-        back() {
-            this.backType = true
-          // 更改了信息才需要提示
-          if(this.updateTime){
-            this.$confirm('编辑的内容未保存，是否保存？', "提示", {
-              type: "warning"
-            }).then(() => {
-              this.save(this.projectManage.state)
-            }).catch(() => {
-              this.$router.back()
-            })
-          } else {
-            this.$router.back()
+            // this.updateProjectJudgment();
           }
+        });
+      }
+    },
+    scoreChange (row, index, val) { // 暂时解决，输入分数，页面没有更新
+      this.projectJudgmentData.splice(index, 1, row);
+    },
+    delJudgePoint (index) { // 删除判分点
+      this.$confirm("确定要删除吗？", "提示", {
+        type: "warning"
+      }).then(() => {
+        this.projectJudgmentData.splice(index, 1);
+      }).catch(() => {
+      });
+    },
+    handleSelectionProjectJudgment (val) {
+      this.selectedProjectJudgment = val;
+    },
+    batchDeleteProjectJudgment () { // 批量删除判分点
+      if (this.selectedProjectJudgment.length) {
+        this.$confirm("确定要删除吗？", "提示", {
+          type: "warning"
+        }).then(() => {
+          let list = this.projectJudgmentData;
+          let result = [];
+          list.map(i => {
+            this.selectedProjectJudgment.find(j => j.judgmentId === i.judgmentId) || result.push(i);
+          });
+          this.projectJudgmentData = result;
+        }).catch(() => {
+        });
+      } else {
+        util.errorMsg("请选择判分点");
+      }
+    },
+    handleQueryJudgment () { // 查询判分点数据
+      let { systemId } = this.projectManage;
+      this.dialogVisible = true;
+      this.$nextTick(() => {
+        this.$refs.judgementTable.clearSelection();
+      });
+      let params = {
+        systemId,
+        name: this.judgementpointsquery
+      };
+      if (systemId == 2 || systemId == 3) {
+        console.log("系统id：", systemId);
+      } else if (systemId == 11 || systemId == 12) {
+        // (流程)交易类
+        this.rowKey = "lcId";
+        this.getProcessClassData(params);
+      } else {
+        // 编程类
+        this.rowKey = "bcId";
+        this.getProgrammingClassData(params);
+      }
+    },
+    getProcessClassData (params) { // 获取流程类判分点列表数据
+      this.visibleLoading = true;
+      this.$get(`${this.api.getBcJudgmentPoint}`, params).then(res => {
+        let list = res.judgmentPoints
+        let result = [];
+        list.map(i => {
+          this.projectJudgmentData.find(j => j.judgmentId === i.judgmentId) || result.push(i);
+        });
+        this.visibleLoading = false;
+        this.judgementData = result;
+      }).catch(err => {
+        this.visibleLoading = false
+      });
+    },
+    getProgrammingClassData (params) { // 获取编程类判分点列表数据
+      this.visibleLoading = true;
+      this.$get(this.api.getBcJudgmentPoint, params).then(res => {
+        let list = res.judgmentPoints
+        let result = [];
+        list.map(i => {
+          this.projectJudgmentData.find(j => j.judgmentId === i.judgmentId) || result.push(i);
+        });
+        this.visibleLoading = false;
+        this.judgementData = result;
+      }).catch(err => {
+        this.visibleLoading = false
+      });
+    },
+    handleSelectionJudgment (val) { // 处理多选判分点
+      this.selectedJudgment = val;
+    },
+    addJudgment () { // 确认选择判分点
+      if (this.selectedJudgment.length) {
+        // console.log(this.selectedJudgment, "queren");
+        this.dialogVisible = false;
+        let tempArr = this.selectedJudgment.map(i => {
+          i.score = 0;
+          return i;
+        });
+        this.projectJudgmentData = this.projectJudgmentData.concat(tempArr);
+        this.projectJudgmentData.map((e, i) => {
+          e.sort = i + 1;
+        });
+        this.$nextTick(() => {
+          this.$refs.projectJudgementTable.clearSelection();
+        });
+      } else {
+        util.errorMsg("请选择判分点");
+      }
+    },
+    handleCacheData () { // 处理缓存数据
+      this.isToPoint = true;
+      this.setProject({ projectManage: this.projectManage, projectJudgmentData: this.projectJudgmentData });
+    },
+    toJudgePoint (type, row) { // 进入判分点系统
+      this.handleCacheData();
+      let jumpPath = Setting.jumpPath;
+      // let jumpPath = "http://192.168.31.154:8087/"; // 本地
+      let { systemId } = this.projectManage;
+      let href = "";
+      if (type === "view") {
+        // 查看
+        if (systemId == 2) {
+          console.log(systemId);
+        } else if (systemId == 3) {
+          console.log(systemId);
+        } else if (systemId == 11 || systemId == 12) {
+          // 交易类判分点（银行综合系统）
+          href = `${jumpPath}#/Transaction?isView=true&systemId=${systemId}&lcId=${row.judgmentId}&token=${this.token}&referrer=${window.btoa(location.href)}`;
+        } else {
+          // 编程类判分点（python子系统）
+          href = `${jumpPath}#/program?isView=true&systemId=${systemId}&bcId=${row.judgmentId}&token=${this.token}&referrer=${window.btoa(location.href)}`;
+        }
+      } else if (type === "edit") {
+        // 自定义（老师端隐藏此功能）
+        if (systemId == 2) {
+          console.log(systemId);
+        } else if (systemId == 3) {
+          console.log(systemId);
+        } else if (systemId == 11 || systemId == 12) {
+          // 交易类判分点（银行综合系统）
+          href = `${jumpPath}#/Transaction?isEdit=true&systemId=${systemId}&lcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
+        } else {
+          // 编程类判分点（python子系统）
+          href = `${jumpPath}#/program?isEdit=true&systemId=${systemId}&bcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
         }
+      } else if (type === "home") {
+        if (systemId == 2 || systemId == 3) {
+          console.log(systemId);
+        } else {
+          // 进入判分点系统首页（老师端隐藏此功能）
+          href = `${jumpPath}#/?systemId=${systemId}&token=${this.token}&referrer=${btoa(location.href)}`;
+        }
+      }
+      location.href = href;
+    },
+    permissionChange () {
+      if (this.projectManage.permissions) {
+        this.projectManage.hintOpen = 1
+      } else {
+        this.projectManage.hintOpen = 0
+      }
+    },
+    // 行拖拽
+    rowDrop () {
+      // 此时找到的元素是要拖拽元素的父容器
+      const tbody = document.querySelector(".draggable .el-table__body-wrapper tbody");
+      const _this = this;
+      Sortable.create(tbody, {
+        //  指定父元素下可被拖拽的子元素
+        draggable: ".draggable .el-table__row",
+        onEnd ({ newIndex, oldIndex }) {
+          _this.projectJudgmentData.splice(newIndex, 0, _this.projectJudgmentData.splice(oldIndex, 1)[0]);
+          let newArray = _this.projectJudgmentData.slice(0);
+          _this.projectJudgmentData = [];
+          _this.$nextTick(function () {
+            newArray.forEach((e, i) => {
+              _this.$set(e, "sort", i + 1);// 不更新
+              _this.$set(e, "name", e.name + "?");
+              _this.$set(e, "name", e.name.slice(0, e.name.length - 1)); // 不更新的解决方案
+            });
+            _this.projectJudgmentData = newArray;
+          });
+        }
+      });
+    },
+    // 修改判分点中间表
+    async updateProjectJudgment () {
+      let param = this.projectJudgmentData.map((e, i) => {
+        let obj = {
+          judgmentId: e.judgmentId,
+          projectId: this.projectId || "",
+          score: e.score,
+          sort: i + 1,
+          id: e.id
+        };
+        return obj;
+      });
+      await this.$post(`${this.api.updateProjectJudgment}?projectId=${this.projectId}`, param).then(res => {
+        let tempArr = this.projectJudgmentData.map(i => {
+          let obj = {
+            projectId: this.projectId ? this.projectId : "",
+            judgmentId: i.judgmentId,
+            score: i.score,
+            sort: i.sort
+          };
+          return obj;
+        });
+        let params = {
+          projectManage: this.projectManage,
+          projectJudgmentList: tempArr
+        };
+        this.updateProject(params);
+      }).catch(err => {
+        console.log(err);
+      });
+    },
+    // 返回
+    back () {
+      this.backType = true
+      // 更改了信息才需要提示
+      if (this.updateTime) {
+        this.$confirm('编辑的内容未保存，是否保存？', "提示", {
+          type: "warning"
+        }).then(() => {
+          this.save(this.projectManage.state)
+        }).catch(() => {
+          this.$router.back()
+        })
+      } else {
+        this.$router.back()
+      }
     }
+  }
 };
 </script>
 
@@ -727,9 +816,9 @@ export default {
     padding: 0;
     border-bottom: 0;
 }
-.main{
+.main {
     overflow: auto;
     overflow-x: hidden;
-    height: calc(100vh - 152px );
+    height: calc(100vh - 152px);
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/project/list/index.vue b/src/pages/project/list/index.vue
index a6e3e20..80672ee 100644
--- a/src/pages/project/list/index.vue
+++ b/src/pages/project/list/index.vue
@@ -1,55 +1,58 @@
 <template>
-    <div>
-        <el-card v-if="showBack" shadow="hover" class="m-b-20">
-            <el-page-header content="实验项目管理" @back="goBack"></el-page-header>
-        </el-card>
-        <div class="page">
-            <h6 class="p-title">筛选</h6>
-            <div class="tool mul">
-                <ul class="filter">
-                    <li>
-                        <label>创建人</label>
-                        <el-select v-model="queryData.founder" placeholder="请选择创建人" @change="founderChange">
-                            <el-option
-                                v-for="(item,index) in founderList"
-                                :key="index"
-                                :label="item.label"
-                                :value="item.value"
-                            ></el-option>
-                        </el-select>
-                    </li>
-                    <li>
-                        <label>状态</label>
-                        <el-select v-model="queryData.state" clearable placeholder="请选择状态" @change="initData">
-                            <el-option
-                                v-for="(item,index) in stateList"
-                                :key="index"
-                                :label="item.label"
-                                :value="item.value"
-                            ></el-option>
-                        </el-select>
-                    </li>
-                    <li>
-                        <label>权限</label>
-                        <el-select v-model="queryData.permissions" placeholder="请选择" @change="initData">
-                            <el-option
-                                v-for="item in permissionsList"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value"
-                            ></el-option>
-                        </el-select>
-                    </li>
-                    <li>
-                        <label>课程</label>
-                        <el-cascader
-                          v-model="cid"
-                          :options="curs"
-                          :props="{ checkStrictly: true, value: 'id' }"
-                          popper-class="course-cas"
-                          @expand-change="curChange"
-                          @change="curChange"></el-cascader>
-                        <!-- <el-select v-model="queryData.cid" @change="courseChange">
+  <div>
+    <el-card v-if="showBack"
+             shadow="hover"
+             class="m-b-20">
+      <el-page-header content="实验项目管理"
+                      @back="goBack"></el-page-header>
+    </el-card>
+    <div class="page">
+      <h6 class="p-title">筛选</h6>
+      <div class="tool mul">
+        <ul class="filter">
+          <li>
+            <label>创建人</label>
+            <el-select v-model="queryData.founder"
+                       placeholder="请选择创建人"
+                       @change="founderChange">
+              <el-option v-for="(item,index) in founderList"
+                         :key="index"
+                         :label="item.label"
+                         :value="item.value"></el-option>
+            </el-select>
+          </li>
+          <li>
+            <label>状态</label>
+            <el-select v-model="queryData.state"
+                       clearable
+                       placeholder="请选择状态"
+                       @change="initData">
+              <el-option v-for="(item,index) in stateList"
+                         :key="index"
+                         :label="item.label"
+                         :value="item.value"></el-option>
+            </el-select>
+          </li>
+          <li>
+            <label>权限</label>
+            <el-select v-model="queryData.permissions"
+                       placeholder="请选择"
+                       @change="initData">
+              <el-option v-for="item in permissionsList"
+                         :key="item.value"
+                         :label="item.label"
+                         :value="item.value"></el-option>
+            </el-select>
+          </li>
+          <li>
+            <label>课程</label>
+            <el-cascader v-model="cid"
+                         :options="curs"
+                         :props="{ checkStrictly: true, value: 'id' }"
+                         popper-class="course-cas"
+                         @expand-change="curChange"
+                         @change="curChange"></el-cascader>
+            <!-- <el-select v-model="queryData.cid" @change="courseChange">
                             <el-option
                                 v-for="item in curriculumList"
                                 :key="item.cid"
@@ -57,8 +60,8 @@
                                 :value="item.cid">
                             </el-option>
                         </el-select> -->
-                    </li>
-                    <!-- <li>
+          </li>
+          <!-- <li>
                         <label>系统</label>
                         <el-select v-model="systemId" placeholder="请选择" @change="initData">
                             <el-option
@@ -69,388 +72,437 @@
                             ></el-option>
                         </el-select>
                     </li> -->
-                    <li>
-                        <el-input placeholder="请输入项目名称" prefix-icon="el-icon-search" v-model="keyword" clearable></el-input>
-                    </li>
-                </ul>
-                <div>
-                    <el-button v-auth type="info" @click="add">新增项目</el-button>
-                    <el-button v-auth type="primary" @click="delAllData">批量删除</el-button>
-                </div>
-            </div>
+          <li>
+            <el-input placeholder="请输入项目名称"
+                      prefix-icon="el-icon-search"
+                      v-model="keyword"
+                      clearable></el-input>
+          </li>
+        </ul>
+        <div>
+          <el-button v-auth
+                     type="info"
+                     @click="add">新增项目</el-button>
+          <el-button v-auth
+                     type="primary"
+                     @click="delAllData">批量删除</el-button>
+        </div>
+      </div>
 
-            <el-table :data="listData" class="table" ref="table" stripe header-align="center"
-                      @selection-change="handleSelectionChange">
-                <el-table-column type="selection" width="55" align="center" :selectable="disabledSelection"></el-table-column>
-                <el-table-column type="index" width="100" label="序号" align="center">
-                    <template slot-scope="scope">{{ scope.$index + (page - 1) * pageSize + 1 }}</template>
-                </el-table-column>
-                <el-table-column prop="projectName" label="实验项目名称" min-width="400" align="center" show-overflow-tooltip></el-table-column>
-                <el-table-column prop="founder" label="创建人" min-width="150" align="center">
-                    <template slot-scope="scope">
-                        {{ founderKeys[scope.row.founder] }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="权限" min-width="120" align="center">
-                    <template slot-scope="scope">
-                        {{ permissionsKeys[scope.row.permissions] }}
-                    </template>
-                </el-table-column>
-                <el-table-column prop="createTime" label="创建时间" min-width="150" align="center"></el-table-column>
-                <el-table-column prop="status" label="状态" min-width="100" align="center">
-                    <template slot-scope="scope">
-                        {{ stateKeys[scope.row.state] }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="操作" width="300" align="center">
-                    <template slot-scope="scope">
-                        <el-button type="text" @click="edit(scope.row, 1)">查看</el-button>
-                        <el-button v-if="scope.row.founder && (roleName.includes('超级') || roleName === scope.row.roleName  || (roleName === '管理员' && !scope.row.roleName.includes('超级')))" type="text" @click="edit(scope.row)">编辑</el-button>
-                        <el-button v-if="scope.row.founder && (roleName.includes('超级') || roleName === scope.row.roleName  || (roleName === '管理员' && !scope.row.roleName.includes('超级')))" type="text" @click="handleDelete(scope.row.projectId)">删除</el-button>
-                        <el-button v-auth type="text" @click="copyData(scope.row.projectId)">复制</el-button>
-                        <el-switch
-                            v-auth="'禁用'"
-                            v-if="scope.row.state"
-                            v-model="scope.row.ccupationlabOpen"
-                            :active-text="scope.row.ccupationlabOpen ? '关闭' : '启用'"
-                            :active-value="0"
-                            :inactive-value="1"
-                            style="margin: 0 10px 0 10px"
-                            @change="switchOff(scope.row)"
-                        ></el-switch>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div class="pagination">
-                <el-pagination background @current-change="handleCurrentChange" :current-page="page" layout="total, prev, pager, next" :total="total"></el-pagination>
-            </div>
+      <el-table :data="listData"
+                class="table"
+                ref="table"
+                stripe
+                header-align="center"
+                @selection-change="handleSelectionChange">
+        <el-table-column type="selection"
+                         width="55"
+                         align="center"
+                         :selectable="disabledSelection"></el-table-column>
+        <el-table-column type="index"
+                         width="100"
+                         label="序号"
+                         align="center">
+          <template slot-scope="scope">{{ scope.$index + (page - 1) * pageSize + 1 }}</template>
+        </el-table-column>
+        <el-table-column prop="projectName"
+                         label="实验项目名称"
+                         min-width="400"
+                         align="center"
+                         show-overflow-tooltip></el-table-column>
+        <el-table-column prop="founder"
+                         label="创建人"
+                         min-width="150"
+                         align="center">
+          <template slot-scope="scope">
+            {{ founderKeys[scope.row.founder] }}
+          </template>
+        </el-table-column>
+        <el-table-column label="权限"
+                         min-width="120"
+                         align="center">
+          <template slot-scope="scope">
+            {{ permissionsKeys[scope.row.permissions] }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="createTime"
+                         label="创建时间"
+                         min-width="150"
+                         align="center"></el-table-column>
+        <el-table-column prop="status"
+                         label="状态"
+                         min-width="100"
+                         align="center">
+          <template slot-scope="scope">
+            {{ stateKeys[scope.row.state] }}
+          </template>
+        </el-table-column>
+        <el-table-column label="操作"
+                         width="300"
+                         align="center">
+          <template slot-scope="scope">
+            <el-button type="text"
+                       @click="edit(scope.row, 1)">查看</el-button>
+            <el-button v-if="scope.row.founder && (roleName.includes('超级') || roleName === scope.row.roleName  || (roleName === '管理员' && !scope.row.roleName.includes('超级')))"
+                       type="text"
+                       @click="edit(scope.row)">编辑</el-button>
+            <el-button v-if="scope.row.founder && (roleName.includes('超级') || roleName === scope.row.roleName  || (roleName === '管理员' && !scope.row.roleName.includes('超级')))"
+                       type="text"
+                       @click="handleDelete(scope.row.projectId)">删除</el-button>
+            <el-button v-auth
+                       type="text"
+                       @click="copyData(scope.row.projectId)">复制</el-button>
+            <el-switch v-auth="'禁用'"
+                       v-if="scope.row.state"
+                       v-model="scope.row.ccupationlabOpen"
+                       :active-text="scope.row.ccupationlabOpen ? '关闭' : '启用'"
+                       :active-value="0"
+                       :inactive-value="1"
+                       style="margin: 0 10px 0 10px"
+                       @change="switchOff(scope.row)"></el-switch>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="pagination">
+        <el-pagination background
+                       @current-change="handleCurrentChange"
+                       :current-page="page"
+                       layout="total, prev, pager, next"
+                       :total="total"></el-pagination>
+      </div>
 
-            <el-dialog title="复制" :visible.sync="copyVisible" width="24%" center :close-on-click-modal="false">
-                <el-form>
-                    <el-form-item>
-                        <!--前端不用做名称判重了：@change='projectNameExistis'-->
-                        <el-input placeholder="请输入项目名称" v-model="projectName"></el-input>
-                    </el-form-item>
-                </el-form>
-                <span slot="footer" class="dialog-footer">
-                <el-button @click="copyVisible = false">取 消</el-button>
-                <el-button type="primary" @click="copySubmit">确 定</el-button>
-            </span>
-            </el-dialog>
-        </div>
+      <el-dialog title="复制"
+                 :visible.sync="copyVisible"
+                 width="24%"
+                 center
+                 :close-on-click-modal="false">
+        <el-form>
+          <el-form-item>
+            <!--前端不用做名称判重了：@change='projectNameExistis'-->
+            <el-input placeholder="请输入项目名称"
+                      v-model="projectName"></el-input>
+          </el-form-item>
+        </el-form>
+        <span slot="footer"
+              class="dialog-footer">
+          <el-button @click="copyVisible = false">取 消</el-button>
+          <el-button type="primary"
+                     @click="copySubmit">确 定</el-button>
+        </span>
+      </el-dialog>
     </div>
+  </div>
 </template>
 
 <script>
 import { mapState, mapActions, mapMutations } from "vuex";
 import util from "@/libs/util";
 export default {
-    data() {
-        return {
-            showBack: Boolean(this.$route.query.show),
-            cid: [],
-            curs: [],
-            systemId: "",
-            systemList: [],
-            systemListAll: [],
-            curriculumId: '',
-            curriculumList: [],
-            queryData: {
-                platformId: 1, // 平台：职站:1 中台:3
-                founder: +this.$route.query.founder || 2, // 创建人角色(0:系统 1:老师 2:全部)
-                state: "", // 状态(0:草稿箱 1:已发布)
-                permissions: "", // 项目权限(0:练习 1:考核 2:竞赛)
-                cid: ''
-            },
-            keyword: "",
-            status: "",
-            listData: [],
-            total: 0,
-            permissionsList: [
-                {
-                    value: "",
-                    label: "不限"
-                }, {
-                    value: 0,
-                    label: "练习"
-                }, {
-                    value: 1,
-                    label: "考核"
-                }, {
-                    value: 2,
-                    label: "竞赛"
-                }
-            ],
-            permissionsKeys: {
-                0: "练习",
-                1: "考核",
-                2: "竞赛"
-            },
-            founderList: [
-                {
-                    value: 2,
-                    label: "全部"
-                }, {
-                    value: 0,
-                    label: "系统"
-                }, {
-                    value: 1,
-                    label: "老师"
-                }
-            ],
-            founderKeys: {
-                0: "系统",
-                1: "老师"
-            },
-            stateList: [
-                {
-                    value: "",
-                    label: "不限"
-                }, {
-                    value: 0,
-                    label: "草稿箱"
-                }, {
-                    value: 1,
-                    label: "已发布"
-                }
-            ],
-            stateKeys: {
-                0: "草稿箱",
-                1: "已发布"
-            },
-            page: +this.$route.query.page || 1,
-            pageSize: 10,
-            multipleSelection: [],
-            copyVisible: false,
-            projectName: "",
-            currentRow: {}, // 复制之后，提交到后台的数据
-            listDataAll: [],
-            isFirst: true
-        };
+  data () {
+    return {
+      showBack: Boolean(this.$route.query.show),
+      cid: [],
+      curs: [],
+      systemId: "",
+      systemList: [],
+      systemListAll: [],
+      curriculumId: '',
+      curriculumList: [],
+      queryData: {
+        platformId: 1, // 平台：职站:1 中台:3
+        founder: +this.$route.query.founder || 2, // 创建人角色(0:系统 1:老师 2:全部)
+        state: "", // 状态(0:草稿箱 1:已发布)
+        permissions: "", // 项目权限(0:练习 1:考核 2:竞赛)
+        cid: ''
+      },
+      keyword: "",
+      status: "",
+      listData: [],
+      total: 0,
+      permissionsList: [
+        {
+          value: "",
+          label: "不限"
+        }, {
+          value: 0,
+          label: "练习"
+        }, {
+          value: 1,
+          label: "考核"
+        }, {
+          value: 2,
+          label: "竞赛"
+        }
+      ],
+      permissionsKeys: {
+        0: "练习",
+        1: "考核",
+        2: "竞赛"
+      },
+      founderList: [
+        {
+          value: 2,
+          label: "全部"
+        }, {
+          value: 0,
+          label: "系统"
+        }, {
+          value: 1,
+          label: "老师"
+        }
+      ],
+      founderKeys: {
+        0: "系统",
+        1: "老师"
+      },
+      stateList: [
+        {
+          value: "",
+          label: "不限"
+        }, {
+          value: 0,
+          label: "草稿箱"
+        }, {
+          value: 1,
+          label: "已发布"
+        }
+      ],
+      stateKeys: {
+        0: "草稿箱",
+        1: "已发布"
+      },
+      page: +this.$route.query.page || 1,
+      pageSize: 10,
+      multipleSelection: [],
+      copyVisible: false,
+      projectName: "",
+      currentRow: {}, // 复制之后，提交到后台的数据
+      listDataAll: [],
+      isFirst: true
+    };
+  },
+  computed: {
+    ...mapState("user", [
+      "userId", "roleId", 'roleName'
+    ]),
+    ...mapState("project", [
+      "lastSystemId",
+      "assFields",
+      "queryDataStatus",
+    ])
+  },
+  watch: {
+    keyword: function (val) {
+      clearTimeout(this.searchTimer);
+      this.searchTimer = setTimeout(() => {
+        this.initData();
+      }, 500);
     },
-    computed: {
-        ...mapState("user", [
-            "userId", "roleId", 'roleName'
-        ]),
-        ...mapState("project", [
-            "lastSystemId", 
-            "assFields",
-            "queryDataStatus",
-        ])
+    queryData: {
+      handler: function (newVal) {
+        this.setQueryStatus({ ...newVal })
+      },
+      deep: true
+    }
+  },
+  mounted () {
+    this.getSystemData()
+    this.getData()
+    if (this.queryDataStatus.platformId) {
+      this.queryData = this.queryDataStatus
+    }
+  },
+  methods: {
+    ...mapActions("project", [
+      "setSystemId"
+    ]),
+    ...mapMutations({
+      setQueryStatus: "project/SET_QUERYDATASTATUS"
+    }),
+    getData () {
+      this.setSystemId(this.systemId);
+      if (this.isFirst) this.page = +this.$route.query.page || 1
+      let data = {
+        ...this.queryData,
+        projectName: this.keyword,
+        pageNum: this.page,
+        pageSize: this.pageSize,
+        systemId: this.systemId
+      };
+      this.$post(this.api.queryProjectManage, data).then(res => {
+        this.isFirst = false
+        this.listData = res.data.records;
+        this.total = res.data.total;
+      }).catch(err => {
+      });
     },
-    watch: {
-        keyword: function(val) {
-            clearTimeout(this.searchTimer);
-            this.searchTimer = setTimeout(() => {
-                this.initData();
-            }, 500);
-        },
-        queryData: {
-            handler: function(newVal) {
-                this.setQueryStatus({...newVal})
-            },
-            deep: true
+    // 获取系统
+    getSystemData () {
+      this.$get(this.api.getSystemIdBySchool).then(({ data }) => {
+        this.systemListAll = data
+        this.getschoolCourse()
+      }).catch(err => { })
+    },
+    // 获取课程
+    getschoolCourse () {
+      this.$get(this.api.getSchoolEffectiveCourse).then(({ data }) => {
+        this.curriculumList = data
+        const { cid } = this.queryData
+        if (data.length) {
+          this.cid = [cid || data[0].cid]
+          const all = this.systemListAll
+          data.map(e => {
+            e.id = e.cid
+            e.label = e.curriculumName
+            e.children = all.filter(n => e.systemId.split(',').includes(n.id + '')) // 筛选出该课程下的系统
+          })
+          this.curs = data
+          this.curChange(this.cid)
         }
+      }).catch(err => { })
+    },
+    // 课程选择回调
+    curChange (val) {
+      const cid = val[0]
+      if (val.length === 1) {
+        // 如果选择的是课程，则默认选中下面第一个系统
+        this.cid = [cid, this.curs.find(e => e.id === cid).children[0].id]
+      }
+      this.queryData.cid = cid
+      this.systemId = this.cid[1]
+      this.initData()
     },
-    mounted() {
-        this.getSystemData()
-        this.getData()
-        if(this.queryDataStatus.platformId) {
-            this.queryData = this.queryDataStatus
+    // 创建人选择回调
+    founderChange (val) {
+      this.$router.push({
+        path: 'list',
+        query: {
+          ...this.$route.query,
+          founder: val
         }
+      })
+      this.initData()
+    },
+    initData () {
+      this.page = 1;
+      this.getData();
+    },
+    disabledSelection (row, index) { // 禁用勾选
+      const roleName = this.roleName
+      if (row.founder && (roleName.includes('超级') || roleName === row.roleName || (roleName === '管理员' && !row.roleName.includes('超级')))) return true
+      return false
+    },
+    handleCurrentChange (val) { // 切换页码
+      this.page = val;
+      // this.$router.push({
+      //   path: '/project/list',
+      //   query: {
+      //     ...this.$route.query,
+      //     page: val
+      //   }
+      // })
+      this.getData();
+    },
+    add () { // 新增项目
+      this.setSystemId(this.systemId);
+      this.$router.push(`/project/add?founder=${this.queryData.founder}`);
+    },
+    edit (row, show) { // 编辑
+      this.setSystemId(row.systemId);
+      this.$router.push(`/project/add?projectId=${row.projectId}&founder=${this.queryData.founder}${show ? `&show=1` : ''}`);
+    },
+    handleSelectionChange (val) { // 处理多选
+      this.multipleSelection = val;
+    },
+    delAllData () { // 批量删除
+      if (this.multipleSelection.length) {
+        let ids = this.multipleSelection.map(item => {
+          return item.projectId;
+        });
+        let strIds = ids.toString();
+        this.handleDelete(strIds);
+      } else {
+        util.errorMsg("请先选择项目");
+      }
     },
-    methods: {
-        ...mapActions("project", [
-            "setSystemId"
-        ]),
-        ...mapMutations({
-            setQueryStatus: "project/SET_QUERYDATASTATUS"
-        }),
-        getData() {
-            this.setSystemId(this.systemId);
-            if (this.isFirst) this.page = +this.$route.query.page || 1
-            let data = {
-                ...this.queryData,
-                projectName: this.keyword,
-                pageNum: this.page,
-                pageSize: this.pageSize,
-                systemId: this.systemId
-            };
-            this.$post(this.api.queryProjectManage, data).then(res => {
-                this.isFirst = false
-                this.listData = res.data.records;
-                this.total = res.data.total;
-            }).catch(err => {
-            });
-        },
-        // 获取系统
-        getSystemData() {
-            this.$get(this.api.getSystemIdBySchool).then(({ data }) => {
-              this.systemListAll = data
-              this.getschoolCourse()
-            }).catch(err => {})
-        },
-        // 获取课程
-        getschoolCourse() {
-            this.$get(this.api.getSchoolEffectiveCourse).then(({ data }) => {
-              this.curriculumList = data
-              const { cid } = this.queryData
-              if (data.length) {
-                this.cid = [cid || data[0].cid]
-                const all = this.systemListAll
-                data.map(e => {
-                  e.id = e.cid
-                  e.label = e.curriculumName
-                  e.children = all.filter(n => e.systemId.split(',').includes(n.id + '')) // 筛选出该课程下的系统
-                })
-                this.curs = data
-                this.curChange(this.cid)
-              }
-            }).catch(err => {})
-        },
-        // 课程选择回调
-        curChange(val) {
-          const cid = val[0]
-          if (val.length === 1) {
-            // 如果选择的是课程，则默认选中下面第一个系统
-            this.cid = [cid, this.curs.find(e => e.id === cid).children[0].id]
+    handleDelete (ids) { // 删除
+      this.$confirm("确定要删除吗？", "提示", {
+        type: "warning"
+      }).then(() => {
+        this.$post(`${this.api.deleteProjectManage}?projectIds=${ids}&platformId=${this.queryData.platformId}`).then(res => {
+          util.successMsg("删除成功");
+          this.$refs.table.clearSelection()
+          this.getData();
+        }).catch(err => {
+          console.log(err);
+        });
+      }).catch(() => {
+        this.$message.info("已取消删除");
+      });
+    },
+    switchOff (row) { // 更新是否启用
+      this.$get(`${this.api.updateIsOpen}?isOpen=${row.ccupationlabOpen}&projectId=${row.projectId}&platformId=${this.queryData.platformId}`).then(res => {
+        util.successMsg("更新启用状态成功");
+        this.getData();
+      }).catch(err => {
+        console.log(err);
+      });
+    },
+    projectNameExistis () { // 项目管理名称判重
+      if (this.projectName) {
+        this.$post(this.api.queryNameIsExist, { projectName: this.projectName }).then(res => {
+          if (res.status === 200) {
+            this.projectNameRepeat = false;
           }
-          this.queryData.cid = cid
-          this.systemId = this.cid[1]
-          this.initData()
-        },
-        // 创建人选择回调
-        founderChange(val) {
-          this.$router.push({
-            path: 'list',
-            query: {
-              ...this.$route.query,
-              founder: val
-            }
-          })
-          this.initData()
-        },
-        initData() {
-            this.page = 1;
-            this.getData();
-        },
-        disabledSelection(row, index) { // 禁用勾选
-            const roleName = this.roleName
-            if (row.founder && (roleName.includes('超级') || roleName === row.roleName  || (roleName === '管理员' && !row.roleName.includes('超级')))) return true
-            return false
-        },
-        handleCurrentChange(val) { // 切换页码
-            this.page = val;
-            // this.$router.push({
-            //   path: '/project/list',
-            //   query: {
-            //     ...this.$route.query,
-            //     page: val
-            //   }
-            // })
-            this.getData();
-        },
-        add() { // 新增项目
-            this.setSystemId(this.systemId);
-            this.$router.push(`/project/add?founder=${this.queryData.founder}`);
-        },
-        edit(row, show) { // 编辑
-            this.setSystemId(row.systemId);
-            this.$router.push(`/project/add?projectId=${row.projectId}&founder=${this.queryData.founder}${show ? `&show=1` : ''}`);
-        },
-        handleSelectionChange(val) { // 处理多选
-            this.multipleSelection = val;
-        },
-        delAllData() { // 批量删除
-            if (this.multipleSelection.length) {
-                let ids = this.multipleSelection.map(item => {
-                    return item.projectId;
-                });
-                let strIds = ids.toString();
-                this.handleDelete(strIds);
-            } else {
-                util.errorMsg("请先选择项目");
-            }
-        },
-        handleDelete(ids) { // 删除
-            this.$confirm("确定要删除吗？", "提示", {
-                type: "warning"
-            }).then(() => {
-                this.$post(`${this.api.deleteProjectManage}?projectIds=${ids}&platformId=${this.queryData.platformId}`).then(res => {
-                    util.successMsg("删除成功");
-                    this.$refs.table.clearSelection()
-                    this.getData();
-                }).catch(err => {
-                    console.log(err);
-                });
-            }).catch(() => {
-                this.$message.info("已取消删除");
-            });
-        },
-        switchOff(row) { // 更新是否启用
-            this.$get(`${this.api.updateIsOpen}?isOpen=${row.ccupationlabOpen}&projectId=${row.projectId}&platformId=${this.queryData.platformId}`).then(res => {
-                util.successMsg("更新启用状态成功");
-                this.getData();
-            }).catch(err => {
-                console.log(err);
-            });
-        },
-        projectNameExistis() { // 项目管理名称判重
-            if (this.projectName) {
-                this.$post(this.api.queryNameIsExist, { projectName: this.projectName }).then(res => {
-                    if (res.status === 200) {
-                        this.projectNameRepeat = false;
-                    }
-                }).catch(err => {
-                    this.projectNameRepeat = true;
-                });
-            } else {
-                this.projectNameRepeat = false;
-            }
-        },
-        copyData(projectId) { // 复制，根据项目id查询详情
-            this.copyVisible = true;
-            this.$get(`${this.api.getProjectDetail}?projectId=${projectId}`).then(res => {
-                this.projectName = res.projectManage.projectName;
-                this.currentRow = {
-                    projectManage: res.projectManage,
-                    projectJudgmentList: res.projectJudgmentVos
-                };
-            }).catch(err => {
-                console.log(err);
-            });
-        },
-        copySubmit() {
-            if (!this.projectName) {
-                util.warningMsg("请输入项目名称");
-                return;
-            }
-            ;
-            if (this.projectNameRepeat) {
-                util.warningMsg("该项目名称已存在");
-                return;
-            }
-            this.currentRow.projectManage.projectName = this.projectName;
-            this.currentRow.projectManage.projectId = "";
-            this.currentRow.projectManage.founder = 1
-            this.currentRow.projectJudgmentList.forEach(i => {
-                i.projectId = "";
-            });
-            this.$post(`${this.api.copyProjectManage}`, this.currentRow).then(res => {
-                this.initData();
-                util.successMsg("复制实验项目成功");
-                this.copyVisible = false;
-            }).catch(err => {
-                console.log(err);
-            });
-        },
-        goBack() { // 返回
-            this.$router.back();
-        }
+        }).catch(err => {
+          this.projectNameRepeat = true;
+        });
+      } else {
+        this.projectNameRepeat = false;
+      }
+    },
+    copyData (projectId) { // 复制，根据项目id查询详情
+      this.copyVisible = true;
+      this.$get(`${this.api.getProjectDetail}?projectId=${projectId}`).then(res => {
+        this.projectName = res.projectManage.projectName;
+        this.currentRow = {
+          projectManage: res.projectManage,
+          projectJudgmentList: res.projectJudgmentVos
+        };
+      }).catch(err => {
+        console.log(err);
+      });
+    },
+    copySubmit () {
+      if (!this.projectName) {
+        util.warningMsg("请输入项目名称");
+        return;
+      }
+      ;
+      if (this.projectNameRepeat) {
+        util.warningMsg("该项目名称已存在");
+        return;
+      }
+      this.currentRow.projectManage.projectName = this.projectName;
+      this.currentRow.projectManage.projectId = "";
+      this.currentRow.projectManage.founder = 1
+      this.currentRow.projectJudgmentList.forEach(i => {
+        i.projectId = "";
+      });
+      this.$post(`${this.api.copyProjectManage}`, this.currentRow).then(res => {
+        this.initData();
+        util.successMsg("复制实验项目成功");
+        this.copyVisible = false;
+      }).catch(err => {
+        console.log(err);
+      });
+    },
+    goBack () { // 返回
+      this.$router.back();
     }
+  }
 };
 </script>
 
 <style lang="scss" scoped>
-
 </style>
\ No newline at end of file
diff --git a/src/pages/station/list/index.vue b/src/pages/station/list/index.vue
index ac87f72..0cc26a6 100644
--- a/src/pages/station/list/index.vue
+++ b/src/pages/station/list/index.vue
@@ -1,89 +1,104 @@
 <template>
-    <!--  实验台  -->
-    <div class="wrap">
-        <div class="search">
-            <h6>创新实验，智能教学</h6>
-            <div class="input" v-auth="'搜索'">
-                <img src="@/assets/img/search.png" alt="">
-                <input type="text" placeholder="请输入关键词" v-model="keyword">
-            </div>
+  <!--  实验台  -->
+  <div class="wrap">
+    <div class="search">
+      <h6>创新实验，智能教学</h6>
+      <div class="input"
+           v-auth="'搜索'">
+        <img src="@/assets/img/search.png"
+             alt="">
+        <input type="text"
+               placeholder="请输入关键词"
+               v-model="keyword">
+      </div>
+    </div>
+    <div class="station">
+      <div class="inner">
+        <div class="tab">
+          <a class="item"
+             v-for="(item, i) in tabs"
+             :key="i"
+             :class="{active: item.id == active}"
+             @click="tabChange(item)">{{ item.name }}</a>
         </div>
-        <div class="station">
-          <div class="inner">
-            <div class="tab">
-              <a class="item" v-for="(item, i) in tabs" :key="i" :class="{active: item.id == active}" @click="tabChange(item)">{{ item.name }}</a>
-            </div>
-            <div class="curs">
-              <template v-if="curriculumList.length">
-                <template v-for="(item,index) in curriculumList">
-                    <div class="item" :title="item.curriculumName" @click="goPreview(item)" :key="index" v-if="!keyword || item.curriculumName.includes(keyword)">
-                        <img :src="item.coverUrl" alt="">
-                        <div class="bottom">
-                            <p class="text"><span>{{ item.goodsName || item.curriculumName }}</span></p>
-                            <a>进入实验</a>
-                        </div>
-                    </div>
-                </template>
-              </template>
-              <div class="empty flex-1" v-else>
-                <div>
-                    <img src="@/assets/img/none.png" alt="">
-                    <p>暂无数据</p>
+        <div class="curs">
+          <template v-if="curriculumList.length">
+            <template v-for="(item,index) in curriculumList">
+              <div class="item"
+                   :title="item.curriculumName"
+                   @click="goPreview(item)"
+                   :key="index"
+                   v-if="!keyword || item.curriculumName.includes(keyword)">
+                <img :src="item.coverUrl"
+                     alt="">
+                <div class="bottom">
+                  <p class="text"><span>{{ item.goodsName || item.curriculumName }}</span></p>
+                  <a>进入实验</a>
                 </div>
               </div>
+            </template>
+          </template>
+          <div class="empty flex-1"
+               v-else>
+            <div>
+              <img src="@/assets/img/none.png"
+                   alt="">
+              <p>暂无数据</p>
             </div>
           </div>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
 export default {
-    name: "backstage",
-    data() {
-        return {
-            keyword: "",
-            active: 0,
-            tabs: [
-              {
-                id: 0,
-                name: '实验课程'
-              },
-              {
-                id: 1,
-                name: '最近使用'
-              }
-            ],
-            curriculumList: []
+  name: "backstage",
+  data () {
+    return {
+      keyword: "",
+      active: 0,
+      tabs: [
+        {
+          id: 0,
+          name: '实验课程'
+        },
+        {
+          id: 1,
+          name: '最近使用'
         }
+      ],
+      curriculumList: []
+    }
+  },
+  mounted () {
+    this.getschoolCourse();
+  },
+  methods: {
+    getschoolCourse () { // 获取课程列表
+      this.active ?
+        this.$post(this.api.recentUse, {
+          pageNum: 1,
+          pageSize: 100
+        }).then(({ page }) => {
+          this.curriculumList = page.records
+        }).catch(err => { }) :
+        this.$get(this.api.schoolCourse).then(res => {
+          this.curriculumList = res.data;
+        }).catch(err => {
+          console.log(err);
+        });
     },
-    mounted() {
-        this.getschoolCourse();
+    goPreview (item) {
+      this.$router.push(`/station/preview?courseId=${item.cid}&curriculumName=${item.curriculumName}&mallId=${item.mallId || ''}&admin=1`);
     },
-    methods: {
-        getschoolCourse() { // 获取课程列表
-          this.active ?
-            this.$post(this.api.recentUse, {
-              pageNum: 1,
-              pageSize: 100
-            }).then(({ page }) => {
-                this.curriculumList = page.records
-            }).catch(err => {}) :
-            this.$get(this.api.schoolCourse).then(res => {
-                this.curriculumList = res.data;
-            }).catch(err => {
-                console.log(err);
-            });
-        },
-        goPreview(item) {
-            this.$router.push(`/station/preview?courseId=${item.cid}&curriculumName=${item.curriculumName}&mallId=${item.mallId || ''}`);
-        },
-        // tab切换
-        tabChange(item) {
-          this.active = item.id
-          this.getschoolCourse()
-        },
-    }
+    // tab切换
+    tabChange (item) {
+      this.active = item.id
+      this.getschoolCourse()
+    },
+  }
 };
 </script>
 
@@ -138,18 +153,18 @@ export default {
         border-bottom: 3px solid transparent;
         cursor: pointer;
         &.active {
-            color: #007EFF;
-            border-color: #007EFF;
+            color: #007eff;
+            border-color: #007eff;
         }
     }
 }
 .station {
     min-height: calc(100vh - 520px);
-    background: url(../../../assets/img/station1.png) (top left)/auto no-repeat,
-                url(../../../assets/img/station2.png) bottom right/auto no-repeat;
+    background: url(../../../assets/img/station1.png) (top left) / auto no-repeat,
+        url(../../../assets/img/station2.png) bottom right/auto no-repeat;
     .inner {
-      width: 1072px;
-      margin: 0 auto;
+        width: 1072px;
+        margin: 0 auto;
     }
     .curs {
         display: flex;
@@ -166,7 +181,7 @@ export default {
             border-radius: 8px;
             cursor: pointer;
             &:hover {
-                opacity: .9;
+                opacity: 0.9;
             }
             img {
                 width: 215px;
@@ -197,26 +212,26 @@ export default {
                 padding: 0 8px;
                 line-height: 28px;
                 font-size: 14px;
-                color: #7A7A7A;
+                color: #7a7a7a;
                 border-radius: 20px;
-                border: 1px solid #DADADA;
+                border: 1px solid #dadada;
             }
         }
     }
 }
-.empty{
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  padding: 50px 0;
-  text-align: center;
-  img{
-    width: 471px;
-  }
-  p{
-    margin-top: 40px;
-    font-size: 18px;
-    color: rgba(0, 0, 0, 0.25);
-  }
+.empty {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 50px 0;
+    text-align: center;
+    img {
+        width: 471px;
+    }
+    p {
+        margin-top: 40px;
+        font-size: 18px;
+        color: rgba(0, 0, 0, 0.25);
+    }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/station/preview/index.vue b/src/pages/station/preview/index.vue
index 21a0dd4..ec1d3c5 100644
--- a/src/pages/station/preview/index.vue
+++ b/src/pages/station/preview/index.vue
@@ -1,240 +1,351 @@
 <template>
-    <div style="padding: 24px">
-        <el-card shadow="hover" class="m-b-20">
-            <div class="flex-between">
-                <el-page-header @back="goBack" :content="curriculumName"></el-page-header>
+  <div style="padding: 24px">
+    <el-card shadow="hover"
+             class="m-b-20">
+      <div class="flex-between">
+        <el-page-header @back="goBack"
+                        :content="curriculumName"></el-page-header>
+      </div>
+    </el-card>
+    <el-card shadow="hover"
+             class="m-b-20"
+             style="background: none;">
+      <div class="flex">
+        <div class="cover"
+             :class="{'is-word': showMask1}">
+          <!--实验台不显示课程封面-->
+          <img v-if="coverUrl"
+               :src="coverUrl"
+               alt=""
+               width="100%"
+               height="100%">
+          <template v-else-if="iframeSrc">
+            <iframe class="inner fileIframe"
+                    id="fileIframe"
+                    :src="iframeSrc"
+                    frameborder="0"></iframe>
+            <template v-if="showMask">
+              <div class="mask"
+                   style="width:100%;background: #393A3D;height: 30px;top: 53px;"></div>
+              <div class="mask"
+                   style="width:100%;background: #393A3D;height: 30px;top: 53px;"></div>
+            </template>
+            <template v-if="showMask1">
+              <div class="word-mask"
+                   style="height: 40px;"></div>
+              <div class="word-mask2"
+                   style="top: 55px;left: 28%;width: 44%;height: calc(100% - 80px);"></div>
+            </template>
+            <template v-if="showMask2">
+              <div class="excel-mask1"
+                   style="height: 48px;"></div>
+            </template>
+          </template>
+          <div class="pdf inner"
+               v-else-if="pdfSrc">
+            <img class="full"
+                 src="@/assets/img/screen/full.png"
+                 alt=""
+                 @click="fullScreen">
+            <p class="arrow">
+              <span @click="changePdfPage(0)"
+                    class="turn el-icon-arrow-left"
+                    :class="{grey: currentPage==1}"></span>
+              {{ currentPage }} / {{ pageCount }}
+              <span @click="changePdfPage(1)"
+                    class="turn el-icon-arrow-right"
+                    :class="{grey: currentPage==pageCount}"></span>
+            </p>
+            <div style='color:#393A3D;height: 30px;background: #393A3D;'></div>
+            <pdf class="pdf-wrap"
+                 :src="pdfSrc"
+                 :page="currentPage"
+                 @num-pages="pageCount=$event"
+                 @page-loaded="currentPage=$event"
+                 @loaded="loadPdfHandler">
+            </pdf>
+          </div>
+          <div class="inner"
+               v-else-if="playAuth">
+            <div class="video_wid"
+                 id="player"></div>
+          </div>
+        </div>
+        <div class="catalog">
+          <div class="m-b-20">
+            <el-button v-if="!overdue"
+                       class="entry"
+                       type="primary"
+                       size="small"
+                       @click="showBuy">续费</el-button>
+            <el-button v-else
+                       class="entry"
+                       type="primary"
+                       @click="entry">进 入 实 验</el-button>
+          </div>
+          <div class="list">
+            <h4 class="title">{{ courseName }}</h4>
+            <div>
+              <h6 class="pro-title">当前教学进度</h6>
+              <el-progress :stroke-width="12"
+                           :percentage="schedule"
+                           :format="percentFormat"
+                           :text-color="'#fff'"></el-progress>
             </div>
-        </el-card>
-        <el-card shadow="hover" class="m-b-20" style="background: none;">
-            <div class="flex">
-                <div class="cover" :class="{'is-word': showMask1}">
-                    <!--实验台不显示课程封面-->
-                    <img v-if="coverUrl" :src="coverUrl" alt="" width="100%" height="100%">
-                    <template v-else-if="iframeSrc">
-                        <iframe class="inner fileIframe" id="fileIframe" :src="iframeSrc" frameborder="0"></iframe>
-                        <template v-if="showMask">
-                            <div class="mask" style="width:100%;background: #393A3D;height: 30px;top: 53px;"></div>
-                            <div class="mask" style="width:100%;background: #393A3D;height: 30px;top: 53px;"></div>
-                        </template>
-                        <template v-if="showMask1">
-                            <div class="word-mask" style="height: 40px;"></div>
-                            <div class="word-mask2"
-                                 style="top: 55px;left: 28%;width: 44%;height: calc(100% - 80px);"></div>
-                        </template>
-                        <template v-if="showMask2">
-                            <div class="excel-mask1" style="height: 48px;"></div>
-                        </template>
-                    </template>
-                    <div class="pdf inner" v-else-if="pdfSrc">
-                        <img class="full" src="@/assets/img/screen/full.png" alt="" @click="fullScreen">
-                        <p class="arrow">
-                            <span @click="changePdfPage(0)" class="turn el-icon-arrow-left"
-                                  :class="{grey: currentPage==1}"></span>
-                            {{ currentPage }} / {{ pageCount }}
-                            <span @click="changePdfPage(1)" class="turn el-icon-arrow-right"
-                                  :class="{grey: currentPage==pageCount}"></span>
-                        </p>
-                        <div style='color:#393A3D;height: 30px;background: #393A3D;'></div>
-                        <pdf
-                            class="pdf-wrap"
-                            :src="pdfSrc"
-                            :page="currentPage"
-                            @num-pages="pageCount=$event"
-                            @page-loaded="currentPage=$event"
-                            @loaded="loadPdfHandler">
-                        </pdf>
-                    </div>
-                    <div class="inner" v-else-if="playAuth">
-                        <div class="video_wid" id="player"></div>
-                    </div>
-                </div>
-                <div class="catalog">
-                    <div class="m-b-20">
-                        <el-button v-if="!overdue" class="entry" type="primary" size="small" @click="showBuy">续费</el-button>
-                        <el-button v-else class="entry" type="primary" @click="entry">进 入 实 验</el-button>
-                    </div>
-                    <div class="list">
-                        <h4 class="title">{{ courseName }}</h4>
-                        <div>
-                          <h6 class="pro-title">当前教学进度</h6>
-                          <el-progress :stroke-width="12" :percentage="schedule" :format="percentFormat" :text-color="'#fff'"></el-progress>
-                        </div>
-                        <div class="types">
-                          <div :class="['item', { active: type === 1 }]" @click="typeChange(1)">
-                            <i class="icon el-icon-notebook-2"></i> 目录
-                          </div>
-                          <div :class="['item', { active: type === 2 }]" @click="typeChange(2)">
-                            <i class="icon el-icon-timer"></i> 教学进度
-                          </div>
-                        </div>
-                        <div class="chapters">
-                          <template v-if="type === 1">
-                            <template v-if="chapterList.length">
-                                <div class="chapter" v-for="(item,index) in chapterList" :key="index">
-                                    <div class="chapterName">{{ item.name }}</div>
-                                    <div class="section" v-if="item.subsectionList.length">
-                                        <div v-for="(section,i) in item.subsectionList" :key="i" @click="preview(section, item.name)">
-                                            <p class="sectionName" :title="section.name" :class="{active: curLink === `${item.name}${section.name}`}">{{ section.name }}</p>
-                                        </div>
-                                    </div>
-                                </div>
-                            </template>
-                          </template>
-                          <div v-else class="section">
-                            <p class="sectionName" v-for="(item, i) in progressList" :key="i" :title="item.projectName">
-                              {{ i + 1 }}. 
-                              {{ item.projectName }}
-                              <i :class="['icon', item.whetherToStudyOrNot ? 'el-icon-success' : 'circle']" @click.stop="studySection(item)"></i>
-                            </p>
-                          </div>
-                        </div>
+            <div class="types">
+              <div :class="['item', { active: type === 1 }]"
+                   @click="typeChange(1)">
+                <i class="icon el-icon-notebook-2"></i> 目录
+              </div>
+              <div :class="['item', { active: type === 2 }]"
+                   @click="typeChange(2)">
+                <i class="icon el-icon-timer"></i> 教学进度
+              </div>
+            </div>
+            <div class="chapters">
+              <template v-if="type === 1">
+                <template v-if="chapterList.length">
+                  <div class="chapter"
+                       v-for="(item,index) in chapterList"
+                       :key="index">
+                    <div class="chapterName">{{ item.name }}</div>
+                    <div class="section"
+                         v-if="item.subsectionList.length">
+                      <div v-for="(section,i) in item.subsectionList"
+                           :key="i"
+                           @click="preview(section, item.name)">
+                        <p class="sectionName"
+                           :title="section.name"
+                           :class="{active: curLink === `${item.name}${section.name}`}">{{ section.name }}</p>
+                      </div>
                     </div>
-                </div>
+                  </div>
+                </template>
+              </template>
+              <div v-else
+                   class="section">
+                <p class="sectionName"
+                   v-for="(item, i) in progressList"
+                   :key="i"
+                   :title="item.projectName">
+                  {{ i + 1 }}.
+                  {{ item.projectName }}
+                  <i :class="['icon', item.whetherToStudyOrNot ? 'el-icon-success' : 'circle']"
+                     @click.stop="studySection(item)"></i>
+                </p>
+              </div>
             </div>
-        </el-card>
-
-        
-        
-        <div class="tabs">
-          <a class="item" v-for="(item, i) in tabs" :key="i" :class="{active: item.id == active}" @click="tabChange(item)">{{ item.name }}</a>
+          </div>
         </div>
-        <div class="tab-content">
-          <template v-if="active === 1">
-            <el-card shadow="hover" class="m-t-20 m-b-20">
-              <h4 style="margin-bottom: 10px;font-size: 16px;">课程简介</h4>
-              <div v-html="briefIntroduction"></div>
-            </el-card>
-            <el-card shadow="hover" class="m-b-20">
-              <h4 style="margin-bottom: 10px;font-size: 16px;">课程目标</h4>
-              <div v-html="teachingObjectives"></div>
-            </el-card>
+      </div>
+    </el-card>
+
+    <div class="tabs">
+      <a class="item"
+         v-for="(item, i) in tabs"
+         :key="i"
+         :class="{active: item.id == active}"
+         @click="tabChange(item)">{{ item.name }}</a>
+    </div>
+    <div class="tab-content">
+      <template v-if="active === 1">
+        <el-card shadow="hover"
+                 class="m-t-20 m-b-20">
+          <div v-html="briefIntroduction"></div>
+        </el-card>
+      </template>
+      <template v-if="active === 2">
+        <div class="page">
+          <template v-if="showNoteAdd">
+            <el-form class="form"
+                     ref="form"
+                     label-width="120px"
+                     center>
+              <el-form-item class="required"
+                            label="笔记标题">
+                <el-input placeholder="请输入笔记标题"
+                          v-model="noteForm.noteName"
+                          maxlength="30"
+                          style="width: 400px"></el-input>
+              </el-form-item>
+              <el-form-item class="required"
+                            label="笔记内容">
+                <Editor api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda'
+                        v-model="noteForm.noteContent"
+                        :init="editorConfig" />
+              </el-form-item>
+            </el-form>
+            <div class="text-right">
+              <el-button type="primary"
+                         @click="submitNote">保存</el-button>
+            </div>
           </template>
-          <template v-if="active === 2">
-            <div class="page">
-              <template v-if="showNoteAdd">
-                <el-form class="form" ref="form" label-width="120px" center>
-                  <el-form-item class="required" label="笔记标题">
-                    <el-input placeholder="请输入笔记标题" v-model="noteForm.noteName" maxlength="30" style="width: 400px"></el-input>
-                  </el-form-item>
-                  <el-form-item class="required" label="笔记内容">
-                    <Editor api-key='rnk6zw9v267xqz7pf98twt1vmrvltmd436je7a642pckltda' v-model="noteForm.noteContent" :init="editorConfig" />
-                  </el-form-item>
-                </el-form>
-                <div class="text-right">
-                  <el-button type="primary" @click="submitNote">保存</el-button>
-                </div>
-              </template>
-              <template v-else>
-                <div class="tool">
-                  <ul class="filter">
-                    <li>
-                      <label>搜索：</label>
-                      <el-input placeholder="请输入标题" v-model="noteKeyword" clearable></el-input>
-                    </li>
-                  </ul>
+          <template v-else>
+            <div class="tool">
+              <ul class="filter">
+                <li>
+                  <label>搜索：</label>
+                  <el-input placeholder="请输入标题"
+                            v-model="noteKeyword"
+                            clearable></el-input>
+                </li>
+              </ul>
+              <div>
+                <el-button type="primary"
+                           @click="addNote">新增笔记</el-button>
+              </div>
+            </div>
+            <el-timeline class="timeline">
+              <el-timeline-item placement="top"
+                                v-for="(item, i) in notes"
+                                :key="i">
+                <p class="sign">{{ item.createTime }}</p>
+                <div class="ver">
                   <div>
-                    <el-button type="primary" @click="addNote">新增笔记</el-button>
+                    {{ item.noteName }}
+                    <span class="action">
+                      <i class="el-icon-edit-outline"
+                         @click="editNote(item)"></i>
+                      <i class="el-icon-delete"
+                         @click="delNote(item)"></i>
+                    </span>
                   </div>
                 </div>
-                <el-timeline class="timeline">
-                    <el-timeline-item placement="top" v-for="(item, i) in notes" :key="i">
-                        <p class="sign">{{ item.createTime }}</p>
-                        <div class="ver">
-                            <div>
-                                {{ item.noteName }}
-                                <span class="action">
-                                    <i class="el-icon-edit-outline" @click="editNote(item)"></i>
-                                    <i class="el-icon-delete" @click="delNote(item)"></i>
-                                </span>
-                            </div>
-                        </div>
-                        <div class="des" v-html="item.noteContent"></div>
-                    </el-timeline-item>
-                </el-timeline>
-              </template>
-            </div>
+                <div class="des"
+                     v-html="item.noteContent"></div>
+              </el-timeline-item>
+            </el-timeline>
           </template>
-          <template v-if="active === 4">
-            <div class="page">
-              <quill ref="quill" :border="true" v-model="msg" :height="150" :toTop="false" />
-              <ul class="msg">
-                <li v-for="(item, i) in msgs" :key="i">
+        </div>
+      </template>
+      <template v-if="active === 4">
+        <div class="page">
+          <quill ref="quill"
+                 :border="true"
+                 v-model="msg"
+                 :height="150"
+                 :toTop="false" />
+          <ul class="msg">
+            <li v-for="(item, i) in msgs"
+                :key="i">
+              <div class="li-wrap">
+                <img :src="item.avatar"
+                     alt=""
+                     class="avatar">
+                <div class="texts">
+                  <h6>
+                    <span class="name">{{ item.userName }}</span>
+                    发表于 {{ item.createDate }}
+                  </h6>
+                  <div class="des"
+                       v-html="item.content"></div>
+                </div>
+                <div class="action">
+                  <i class="icon el-icon-chat-dot-square"></i>
+                  <i class="icon el-icon-delete"></i>
+                  <img class="icon"
+                       src="@/assets/img/like.png"
+                       alt="">
+                </div>
+              </div>
+              <div class="reply"
+                   v-if="item.showReply">
+                <quill :border="true"
+                       v-model="item.replyContent"
+                       :toTop="false"
+                       :height="150" />
+                <div class="m-t-10 text-right">
+                  <el-button type="primary"
+                             size="mini">提交</el-button>
+                </div>
+              </div>
+              <ul class="msg children"
+                  v-if="item.showChildren">
+                <li v-for="(reply,i) in item.children"
+                    :key="i">
                   <div class="li-wrap">
-                    <img :src="item.avatar" alt="" class="avatar">
+                    <img class="avatar"
+                         :src="reply.avatar"
+                         alt="">
                     <div class="texts">
-                      <h6>
-                        <span class="name">{{ item.userName }}</span>
-                        发表于 {{ item.createDate }}
-                      </h6>
-                      <div class="des" v-html="item.content"></div>
+                      <div class="name">{{reply.userName}}</div>
+                      <div class="des"
+                           v-html="reply.content"></div>
+                      <div class="date">{{reply.createDate}}</div>
                     </div>
                     <div class="action">
                       <i class="icon el-icon-chat-dot-square"></i>
                       <i class="icon el-icon-delete"></i>
-                      <img class="icon" src="@/assets/img/like.png" alt="">
+                      <img class="icon"
+                           src="@/assets/img/like.png"
+                           alt="">
                     </div>
                   </div>
-                  <div class="reply" v-if="item.showReply">
-                    <quill :border="true" v-model="item.replyContent" :toTop="false" :height="150" />
+                  <div class="reply"
+                       v-if="reply.showReply">
+                    <quill :border="true"
+                           v-model="reply.replyContent"
+                           :toTop="false"
+                           :height="150" />
                     <div class="m-t-10 text-right">
-                        <el-button type="primary" size="mini">提交</el-button>
+                      <el-button type="primary"
+                                 size="mini">提交</el-button>
                     </div>
-                </div>
-                <ul class="msg children" v-if="item.showChildren">
-                    <li v-for="(reply,i) in item.children" :key="i">
-                        <div class="li-wrap">
-                            <img class="avatar" :src="reply.avatar" alt="">
-                            <div class="texts">
-                                <div class="name">{{reply.userName}}</div>
-                                <div class="des" v-html="reply.content"></div>
-                                <div class="date">{{reply.createDate}}</div>
-                            </div>
-                            <div class="action">
-                              <i class="icon el-icon-chat-dot-square"></i>
-                              <i class="icon el-icon-delete"></i>
-                              <img class="icon" src="@/assets/img/like.png" alt="">
-                            </div>
-                        </div>
-                        <div class="reply" v-if="reply.showReply">
-                            <quill :border="true" v-model="reply.replyContent" :toTop="false" :height="150" />
-                            <div class="m-t-10 text-right">
-                                <el-button type="primary" size="mini">提交</el-button>
-                            </div>
-                        </div>
-                    </li>
-                </ul>
-                <div v-if="item.getCommentReplyNum" class="toggle"><span @click="item.showChildren = !item.showChildren">{{item.showChildren ? '收起所有回复' : `查看所有${item.getCommentReplyNum}条回复`}} <i class="el-icon-arrow-down"></i></span></div>
+                  </div>
                 </li>
               </ul>
-            </div>
-          </template>
+              <div v-if="item.getCommentReplyNum"
+                   class="toggle"><span @click="item.showChildren = !item.showChildren">{{item.showChildren ? '收起所有回复' : `查看所有${item.getCommentReplyNum}条回复`}} <i class="el-icon-arrow-down"></i></span></div>
+            </li>
+          </ul>
         </div>
+      </template>
+    </div>
 
+    <el-dialog title="请选择项目"
+               v-loading="loading"
+               :visible.sync="projectVisible"
+               width="828px"
+               custom-class="project-dia"
+               :close-on-click-modal="false">
+      <ul class="projects">
+        <li v-for="(item, i) in projects"
+            :key="i"
+            :class="{active: curProject == item.projectId}"
+            @click="selectProject(item)">
+          <img src="@/assets/img/project.png"
+               alt="">
+          <span>{{ i + 1 }}. {{ item.projectName }}</span>
+        </li>
+      </ul>
 
-        <el-dialog title="请选择项目" v-loading="loading" :visible.sync="projectVisible" width="828px" custom-class="project-dia" :close-on-click-modal="false">
-          <ul class="projects">
-            <li v-for="(item, i) in projects" :key="i" :class="{active: curProject == item.projectId}" @click="selectProject(item)">
-              <img src="@/assets/img/project.png" alt="">
-              <span>{{ i + 1 }}. {{ item.projectName }}</span>
-            </li>
-          </ul>
-          
-          <span slot="footer" class="dialog-footer">
-            <el-button size="small" @click="projectVisible = false">取 消</el-button>
-            <el-button size="small" type="primary" @click="toSub">确 定</el-button>
-          </span>
-        </el-dialog>
+      <span slot="footer"
+            class="dialog-footer">
+        <el-button size="small"
+                   @click="projectVisible = false">取 消</el-button>
+        <el-button size="small"
+                   type="primary"
+                   @click="toSub">确 定</el-button>
+      </span>
+    </el-dialog>
 
-        <!-- 购买弹框 -->
-        <el-dialog title="温馨提示" :visible.sync="buyVisible" width="420px" center :close-on-click-modal="false">
-          <div class="buy">
-            <p class="tips">该课程订阅期限已到期，若需要续费请扫码添加客服咨询</p>
-            <img src="@/assets/img/wechat-code.jpeg" alt="">
-          </div>
-        </el-dialog>
+    <!-- 购买弹框 -->
+    <el-dialog title="温馨提示"
+               :visible.sync="buyVisible"
+               width="420px"
+               center
+               :close-on-click-modal="false">
+      <div class="buy">
+        <p class="tips">该课程订阅期限已到期，若需要续费请扫码添加客服咨询</p>
+        <img src="@/assets/img/wechat-code.jpeg"
+             alt="">
+      </div>
+    </el-dialog>
 
-        <pdfDia :key="pdfVisible" :visible.sync="pdfVisible" :src.sync="pdfSrc"/>
-    </div>
+    <pdfDia :key="pdfVisible"
+            :visible.sync="pdfVisible"
+            :src.sync="pdfSrc" />
+  </div>
 </template>
 
 <script>
@@ -247,469 +358,473 @@ import pdfDia from '@/components/pdf'
 import Editor from '@tinymce/tinymce-vue'
 import editorConfig from '@/components/editor'
 export default {
-    components: { pdf, pdfDia, quill, Editor },
-    data() {
-        return {
-            editorConfig,
-            courseId: this.$route.query.courseId,
-            mallId: this.$route.query.mallId,
-            curriculumName: this.$route.query.curriculumName,
-            chapter: this.$route.query.chapter,
-            section: this.$route.query.section,
-            type: 1,
-            video: "http://liuwanr.oss-cn-shenzhen.aliyuncs.com/mp4/20200519/1589871025648.mp4",
-            chapterList: [], // 章节列表
-            progressList: [],
-            coverUrl: "", // 课程封面
-            courseName: "", // 课程名称
-            briefIntroduction: "", // 课程简介
-            teachingObjectives: "", // 课程目标
-            assessmentList: "", // 考核列表
-            systemIds: '',
-            curLink: "", // 当前选中
-            playAuth: "",
-            player: null,
-            previewImg: "",
-            iframeSrc: "",
-            isWord: false,
-            isPPT: false,
-            isExcel: false,
-            showMask: false,
-            showMask1: false,
-            showMask2: false,
-            closePosi: {
-                top: "80px"
-            },
-            pdfVisible: false,
-            pdfSrc: "",
-            currentPage: 0, // pdf文件页码
-            pageCount: 0, // pdf文件总页数
-            fileType: "pdf", // 文件类型
-            desShrink: false,
-            projectVisible: false,
-            projects: [],
-            loading: false,
-            curProject: '',
-            overdue: 0, //是否过期
-            buyVisible: false,
-            active: 1,
-            tabs: [
-              {
-                id: 1,
-                name: '课程介绍'
-              },
-              {
-                id: 2,
-                name: '课程笔记'
-              },
-              {
-                id: 3,
-                name: '全国排行榜'
-              },
-              {
-                id: 4,
-                name: '教学互动'
-              }
-            ],
-            schedule: 0,
-            plan: '',
-            noteKeyword: '',
-            searchTimer: null,
-            notes: [],
-            showNoteAdd: false,
-            noteContent: '',
-            noteForm: {
-              cid: +this.$route.query.courseId,
-              noteContent: '',
-              noteName: '',
-            },
-            msg: '',
-            msgs: [
-              {
-                avatar: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png',
-                createDate: '2023-04-28 12:41:10',
-                userName: '刘恒',
-                content: '基础、个人、增值',
-                showReply: false,
-                getCommentReplyNum: 1,
-                showChildren: false,
-                children: [
-                  {
-                    avatar: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png',
-                    createDate: '2023-04-29 09:22:13',
-                    userName: '公瑾',
-                    content: '基础、个人、增值',
-                    showReply: false,
-                  }
-                ]
-              }
-            ]
-        };
+  components: { pdf, pdfDia, quill, Editor },
+  data () {
+    return {
+      editorConfig,
+      courseId: this.$route.query.courseId,
+      mallId: this.$route.query.mallId || '',
+      curriculumName: this.$route.query.curriculumName,
+      chapter: this.$route.query.chapter,
+      section: this.$route.query.section,
+      fromAdmin: this.$route.query.admin, // 是否从产品中心or实验台进来
+      type: 1,
+      video: "http://liuwanr.oss-cn-shenzhen.aliyuncs.com/mp4/20200519/1589871025648.mp4",
+      chapterList: [], // 章节列表
+      progressList: [],
+      coverUrl: "", // 课程封面
+      courseName: "", // 课程名称
+      briefIntroduction: "", // 课程简介
+      teachingObjectives: "", // 课程目标
+      assessmentList: "", // 考核列表
+      systemIds: '',
+      curLink: "", // 当前选中
+      playAuth: "",
+      player: null,
+      previewImg: "",
+      iframeSrc: "",
+      isWord: false,
+      isPPT: false,
+      isExcel: false,
+      showMask: false,
+      showMask1: false,
+      showMask2: false,
+      closePosi: {
+        top: "80px"
+      },
+      pdfVisible: false,
+      pdfSrc: "",
+      currentPage: 0, // pdf文件页码
+      pageCount: 0, // pdf文件总页数
+      fileType: "pdf", // 文件类型
+      desShrink: false,
+      projectVisible: false,
+      projects: [],
+      loading: false,
+      curProject: '',
+      overdue: 0, //是否过期
+      buyVisible: false,
+      active: 1,
+      tabs: [
+        {
+          id: 1,
+          name: '课程介绍'
+        },
+        {
+          id: 2,
+          name: '课程笔记'
+        },
+        {
+          id: 3,
+          name: '全国排行榜'
+        },
+        {
+          id: 4,
+          name: '教学互动'
+        }
+      ],
+      schedule: 0,
+      plan: '',
+      noteKeyword: '',
+      searchTimer: null,
+      notes: [],
+      showNoteAdd: false,
+      noteContent: '',
+      noteForm: {
+        cid: +this.$route.query.courseId,
+        noteContent: '',
+        noteName: '',
+      },
+      msg: '',
+      msgs: [
+        {
+          avatar: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png',
+          createDate: '2023-04-28 12:41:10',
+          userName: '刘恒',
+          content: '基础、个人、增值',
+          showReply: false,
+          getCommentReplyNum: 1,
+          showChildren: false,
+          children: [
+            {
+              avatar: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png',
+              createDate: '2023-04-29 09:22:13',
+              userName: '公瑾',
+              content: '基础、个人、增值',
+              showReply: false,
+            }
+          ]
+        }
+      ]
+    };
+  },
+  computed: {
+    ...mapState("user", [
+      "userId", "studentId", "roleId", "userName"
+    ])
+  },
+  watch: {
+    noteKeyword: function (val) {
+      clearTimeout(this.searchTimer);
+      this.searchTimer = setTimeout(() => {
+        this.getNote();
+      }, 500);
+    }
+  },
+  mounted () {
+    this.insertScript();
+    this.getData();
+    this.addRecord()
+    this.getNote()
+  },
+  methods: {
+    goBack () {
+      this.fromAdmin ?
+        this.$router.back() :
+        this.$router.push('/station')
     },
-    computed: {
-        ...mapState("user", [
-            "userId", "studentId", "roleId", "userName"
-        ])
+    async getData () {
+      let { data } = await this.$post(`${this.api.curriculumDetail}?cid=${this.courseId}&mallId=${this.mallId}`);
+      this.courseName = data.curriculumName;
+      // this.coverUrl = data.coverUrl;
+      this.briefIntroduction = data.briefIntroduction;
+      this.teachingObjectives = data.teachingObjectives;
+      this.assessmentList = data.assessmentConfig;
+      this.systemIds = data.systemIds
+      this.getStatus()
     },
-    watch: {
-        noteKeyword: function(val) {
-            clearTimeout(this.searchTimer);
-            this.searchTimer = setTimeout(() => {
-                this.getNote();
-            }, 500);
-        }
+    // 记录最近使用
+    addRecord () {
+      this.$post(`${this.api.recordRecentUsage}?cid=${this.courseId}`).then(res => { }).catch(res => { })
+    },
+    // 查询是否过期
+    getStatus () {
+      this.$get(this.api.whetherToRenewTheFee, {
+        cid: this.courseId
+      }).then(({ isRenew }) => {
+        // 1正常显示资源，0显示续费
+        this.overdue = isRenew
+        this.getChapter()
+        this.getProgress()
+      }).catch(res => { })
+    },
+    // 获取章节小节
+    async getChapter () {
+      let res = await this.$get(`${this.api.curriculumChapter}/${this.courseId}`);
+      this.chapterList = res.chapterList;
+      console.log(11, this.chapter)
+      const chapter = this.chapter === undefined ? 0 : +this.chapter
+      const section = this.section === undefined ? 0 : +this.section
+      const clist = this.chapterList[chapter]
+      if (this.chapterList.length && clist.subsectionList && clist.subsectionList.length) {
+        this.preview(clist.subsectionList[section], clist.name, 1);
+      }
+    },
+    // 获取学习进度
+    async getProgress () {
+      let res = await this.$post(`${this.api.courseLearningProgress}?courseId=${this.courseId}&systemId=${this.systemIds}`);
+      this.progressList = res.list
+      this.plan = res.plan
+      this.schedule = +(res.schedule.replace('%', ''))
+    },
+    // 进度数字自定义
+    percentFormat (val) {
+      return this.plan
     },
-    mounted() {
-        this.insertScript();
-        this.getData();
-        this.addRecord()
+    // 目录和进度切换
+    typeChange (id) {
+      this.getChapter()
+      this.type = id
+    },
+    // 获取课程笔记
+    getNote () {
+      this.$get(this.api.curriculumNoteList, {
+        cid: this.courseId,
+        search: this.noteKeyword
+      }).then(res => {
+        this.notes = res.curriculumNotes
+      }).catch(res => { })
+    },
+    // 新增笔记
+    addNote () {
+      this.noteForm = {
+        cid: this.courseId,
+        noteContent: '',
+        noteName: '',
+      }
+      this.showNoteAdd = true
+    },
+    // 保存笔记
+    submitNote () {
+      const form = this.noteForm
+      console.log(33, form, this.noteContent)
+      if (!form.noteName) return util.errorMsg('请输入笔记标题')
+      if (!form.noteContent) return util.errorMsg('请输入笔记内容')
+      this.$post(this.api[form.noteId ? 'updateNote' : 'addNote'], form).then(res => {
         this.getNote()
+        util.successMsg(form.noteId ? '修改成功' : '添加成功')
+        this.showNoteAdd = false
+      }).catch(res => { })
     },
-    methods: {
-        goBack() {
-            this.$router.back()
-        },
-        async getData() {
-            let { data } = await this.$post(`${this.api.curriculumDetail}?cid=${this.courseId}&mallId=${this.mallId}`);
-            this.courseName = data.curriculumName;
-            // this.coverUrl = data.coverUrl;
-            this.briefIntroduction = data.briefIntroduction;
-            this.teachingObjectives = data.teachingObjectives;
-            this.assessmentList = data.assessmentConfig;
-            this.systemIds = data.systemIds
-            this.getStatus()
-        },
-        // 记录最近使用
-        addRecord() {
-          this.$post(`${this.api.recordRecentUsage}?cid=${this.courseId}`).then(res => {}).catch(res => {})
-        },
-        // 查询是否过期
-        getStatus() {
-          this.$get(this.api.whetherToRenewTheFee, {
-            cid: this.courseId
-          }).then(({ isRenew }) => {
-            // 1正常显示资源，0显示续费
-            this.overdue = isRenew
-            this.getChapter()
-            this.getProgress()
-          }).catch(res => {})
-        },
-        // 获取章节小节
-        async getChapter() {
-            let res = await this.$get(`${this.api.curriculumChapter}/${this.courseId}`);
-            this.chapterList = res.chapterList;
-            console.log(11, this.chapter)
-            const chapter = this.chapter === undefined ? 0 : +this.chapter
-            const section = this.section === undefined ? 0 : +this.section
-            const clist = this.chapterList[chapter]
-            if (this.chapterList.length && clist.subsectionList && clist.subsectionList.length) {
-                this.preview(clist.subsectionList[section], clist.name, 1);
-            }
-        },
-        // 获取学习进度
-        async getProgress() {
-            let res = await this.$post(`${this.api.courseLearningProgress}?courseId=${this.courseId}&systemId=${this.systemIds}`);
-            this.progressList = res.list
-            this.plan = res.plan
-            this.schedule = +(res.schedule.replace('%', ''))
-        },
-        // 进度数字自定义
-        percentFormat(val) {
-          return this.plan
-        },
-        // 目录和进度切换
-        typeChange(id) {
-          this.getChapter()
-          this.type = id
-        },
-        // 获取课程笔记
-        getNote() {
-          this.$get(this.api.curriculumNoteList, {
-            cid: this.courseId,
-            search: this.noteKeyword
-          }).then(res => {
-            this.notes = res.curriculumNotes
-          }).catch(res => {})
-        },
-        // 新增笔记
-        addNote() {
-          this.noteForm = {
-            cid: this.courseId,
-            noteContent: '',
-            noteName: '',
-          }
-          this.showNoteAdd = true
-        },
-        // 保存笔记
-        submitNote() {
-          const form = this.noteForm
-          console.log(33, form,this.noteContent)
-          if (!form.noteName) return util.errorMsg('请输入笔记标题')
-          if (!form.noteContent) return util.errorMsg('请输入笔记内容')
-          this.$post(this.api[form.noteId ? 'updateNote' : 'addNote'], form).then(res => {
-            this.getNote()
-            util.successMsg(form.noteId ? '修改成功' : '添加成功')
-            this.showNoteAdd = false
-          }).catch(res => {})
-        },
-        // 删除笔记
-        delNote(row) {
-          this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
-              type: "warning"
-          }).then(() => {
-            this.$post(`${this.api.deleteNotes}?noteId=${row.noteId}`).then(res => {
-                util.successMsg("删除成功");
-                this.getNote();
-            }).catch(res => {})
-          }).catch(() => {})
-        },
-        // 编辑笔记
-        editNote(row) {
-          this.noteForm = JSON.parse(JSON.stringify(row))
-          this.showNoteAdd = true
-        },
-        // 插入阿里云播放器脚本
-        insertScript() {
-            const linkTag = document.createElement("link");
-            linkTag.id = "aliplayerLink";
-            linkTag.rel = "stylesheet";
-            linkTag.href = "https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css";
-            document.body.appendChild(linkTag);
+    // 删除笔记
+    delNote (row) {
+      this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
+        type: "warning"
+      }).then(() => {
+        this.$post(`${this.api.deleteNotes}?noteId=${row.noteId}`).then(res => {
+          util.successMsg("删除成功");
+          this.getNote();
+        }).catch(res => { })
+      }).catch(() => { })
+    },
+    // 编辑笔记
+    editNote (row) {
+      this.noteForm = JSON.parse(JSON.stringify(row))
+      this.showNoteAdd = true
+    },
+    // 插入阿里云播放器脚本
+    insertScript () {
+      const linkTag = document.createElement("link");
+      linkTag.id = "aliplayerLink";
+      linkTag.rel = "stylesheet";
+      linkTag.href = "https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css";
+      document.body.appendChild(linkTag);
 
-            const scriptTag = document.createElement("script");
-            scriptTag.id = "aliplayerScript";
-            scriptTag.type = "text/javascript";
-            scriptTag.src = "https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js";
-            document.body.appendChild(scriptTag);
-            this.$once("hook:beforeDestroy", function() {
-                document.body.removeChild(document.querySelector("#aliplayerLink"));
-                document.body.removeChild(document.querySelector("#aliplayerScript"));
+      const scriptTag = document.createElement("script");
+      scriptTag.id = "aliplayerScript";
+      scriptTag.type = "text/javascript";
+      scriptTag.src = "https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js";
+      document.body.appendChild(scriptTag);
+      this.$once("hook:beforeDestroy", function () {
+        document.body.removeChild(document.querySelector("#aliplayerLink"));
+        document.body.removeChild(document.querySelector("#aliplayerScript"));
+      });
+    },
+    // 显示咨询弹框
+    showBuy () {
+      this.buyVisible = true
+    },
+    transferType (ext) {
+      if ("jpg,jpeg,png,gif,svg,psd".includes(ext)) return "图片";
+      if ("mp4,3gp,mov,m4v,avi,dat,mkv,flv,vob,rmvb,rm,qlv".includes(ext)) return "视频";
+      return ext;
+    },
+    // tab切换
+    tabChange (item) {
+      this.active = item.id
+    },
+    // 勾选/取消勾选学习进度
+    studySection (item) {
+      item.whetherToStudyOrNot ?
+        this.$post(`${this.api.deleteLearningProgress}?id=${item.learningProgressId}`).then(res => {
+          this.getProgress()
+        }).catch(res => { }) :
+        this.$post(this.api.saveLearningProgress, {
+          cid: this.courseId,
+          projectId: item.projectId,
+        }).then(res => {
+          this.getProgress()
+        }).catch(res => { })
+    },
+    preview (row, chapterName, showDia = 0) {
+      // 如果没过期，则正常预览，否则显示购买弹框
+      if (this.overdue || showDia) {
+        this.curLink = `${chapterName}${row.name}`; // 章节名称+小节名称，小节名称有重复的情况，如果只用小节名称判断，会有同时选中多个的情况
+        this.playauth = "";
+        this.coverUrl = "";
+        this.pdfSrc = "";
+        this.iframeSrc = "";
+        this.isPPT = false;
+        this.isWord = false;
+        this.isExcel = false;
+        if (this.transferType(row.fileType) == "视频") {
+          this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => {
+            this.playAuth = res.data.playAuth;
+            // 如果已经产生了实例，则销毁重新创建，不然播放器会播放上一个视频
+            if (this.player) {
+              this.player.dispose()
+              this.player = null
+            }
+            this.$nextTick(() => {
+              if (this.player) {
+                this.player.replayByVidAndPlayAuth(row.fileId, this.playAuth);
+              } else {
+                this.player = new Aliplayer({
+                  id: "player",
+                  width: "100%",
+                  autoplay: false,
+                  vid: row.fileId,
+                  playauth: this.playAuth,
+                  encryptType: 1 //当播放私有加密流时需要设置。
+                });
+              }
             });
-        },
-        // 显示咨询弹框
-        showBuy() {
-          this.buyVisible = true
-        },
-        transferType(ext) {
-            if ("jpg,jpeg,png,gif,svg,psd".includes(ext)) return "图片";
-            if ("mp4,3gp,mov,m4v,avi,dat,mkv,flv,vob,rmvb,rm,qlv".includes(ext)) return "视频";
-            return ext;
-        },
-        // tab切换
-        tabChange(item) {
-          this.active = item.id
-        },
-        // 勾选/取消勾选学习进度
-        studySection(item) {
-          item.whetherToStudyOrNot ?
-            this.$post(`${this.api.deleteLearningProgress}?id=${item.learningProgressId}`).then(res => {
-            this.getProgress()
-          }).catch(res => {}) :
-            this.$post(this.api.saveLearningProgress, {
-              cid: this.courseId,
-              projectId: item.projectId,
-            }).then(res => {
-              this.getProgress()
-            }).catch(res => {})
-        },
-        preview(row, chapterName, showDia = 0) {
-          // 如果没过期，则正常预览，否则显示购买弹框
-          if (this.overdue || showDia) {
-            this.curLink = `${chapterName}${row.name}`; // 章节名称+小节名称，小节名称有重复的情况，如果只用小节名称判断，会有同时选中多个的情况
-            this.playauth = "";
-            this.coverUrl = "";
-            this.pdfSrc = "";
-            this.iframeSrc = "";
-            this.isPPT = false;
-            this.isWord = false;
-            this.isExcel = false;
-            if (this.transferType(row.fileType) == "视频") {
-                this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => {
-                    this.playAuth = res.data.playAuth;
-                    // 如果已经产生了实例，则销毁重新创建，不然播放器会播放上一个视频
-                    if (this.player) {
-                        this.player.dispose()
-                        this.player = null
-                    }
-                    this.$nextTick(() => {
-                        if (this.player) {
-                            this.player.replayByVidAndPlayAuth(row.fileId, this.playAuth);
-                        } else {
-                            this.player = new Aliplayer({
-                                id: "player",
-                                width: "100%",
-                                autoplay: false,
-                                vid: row.fileId,
-                                playauth: this.playAuth,
-                                encryptType: 1 //当播放私有加密流时需要设置。
-                            });
-                        }
-                    });
 
-                }).catch(res => {
-                });
-            } else if (this.transferType(row.fileType) == "图片") {
-                this.coverUrl = row.fileUrl;
-            } else if (row.fileType == "pdf") {
-                this.pdfSrc = row.fileUrl;
+          }).catch(res => {
+          });
+        } else if (this.transferType(row.fileType) == "图片") {
+          this.coverUrl = row.fileUrl;
+        } else if (row.fileType == "pdf") {
+          this.pdfSrc = row.fileUrl;
+        } else {
+          this.$get(`${this.api.curriculumGetSubsection}/${row.id}`).then(res => {
+            if (row.fileType == "pptx") {
+              this.isPPT = true;
+              this.isWord = false;
+              this.isExcel = false;
+            } else if (row.fileType == "doc" || row.fileType == "docx") {
+              this.isPPT = false;
+              this.isWord = true;
+              this.isExcel = false;
+            } else if (row.fileType == "xls" || row.fileType == "xlsx") {
+              this.isExcel = true;
+              this.isPPT = false;
+              this.isWord = false;
             } else {
-                this.$get(`${this.api.curriculumGetSubsection}/${row.id}`).then(res => {
-                    if (row.fileType == "pptx") {
-                        this.isPPT = true;
-                        this.isWord = false;
-                        this.isExcel = false;
-                    } else if (row.fileType == "doc" || row.fileType == "docx") {
-                        this.isPPT = false;
-                        this.isWord = true;
-                        this.isExcel = false;
-                    } else if (row.fileType == "xls" || row.fileType == "xlsx") {
-                        this.isExcel = true;
-                        this.isPPT = false;
-                        this.isWord = false;
-                    } else {
-                        this.isPPT = false;
-                        this.isWord = false;
-                        this.isExcel = false;
-                    }
-                    if (this.isPPT) {
-                        this.showMask = true;
-                    } else {
-                        this.showMask = false;
-                    }
-                    if (this.isWord) {
-                        this.showMask1 = true;
-                    } else {
-                        this.showMask1 = false;
-                    }
-                    if (this.isExcel) {
-                        this.showMask2 = true;
-                    } else {
-                        this.showMask2 = false;
-                    }
-                    this.iframeSrc = res.previewUrl;
-                }).catch(err => {});
+              this.isPPT = false;
+              this.isWord = false;
+              this.isExcel = false;
             }
-          } else {
-            this.showBuy()
-          }
-        },
-        closePlayer() {
-            this.playAuth = "";
-            this.player.pause();
-        },
-        closeIframe() {
-            this.iframeSrc = "";
-            this.showMask = false;
-            this.showMask1 = false;
-        },
-        closePdf() {
-            this.pdfSrc = "";
-            this.currentPage = 1;
-        },
-        changePdfPage(val) {
-            if (val === 0 && this.currentPage > 1) {
-                this.currentPage--;
+            if (this.isPPT) {
+              this.showMask = true;
+            } else {
+              this.showMask = false;
             }
-            if (val === 1 && this.currentPage < this.pageCount) {
-                this.currentPage++;
+            if (this.isWord) {
+              this.showMask1 = true;
+            } else {
+              this.showMask1 = false;
             }
-        },
-        loadPdfHandler(e) {
-            this.currentPage = 1;
-        },
-        // pdf全屏
-        fullScreen() {
-          this.pdfVisible = true
-        },
-        // 选择项目
-        selectProject(item) {
-          this.curProject = item.projectId
-        },
-        // 展示选择项目弹框
-        queryProject() {
-          this.projectVisible = true
-          this.loading = true
-          this.$get(this.api.getProjectBySystemId, {
-            systemId: this.systemIds,
-            cId: this.courseId, // 课程id
-            permissions: 0 // 0: 练习,1: 考核
-          }).then(({ projects }) => {
-            this.loading = false
-            this.projects = projects
-          }).catch(res => {})
-        },
-        // 进入实验
-        entry() {
-          // 查询上次做的项目
-          this.$get(this.api.getTheMostRecentlyRunProject, {
-            cid: this.courseId
-          }).then(({ data }) => {
-            // 返回了data则提示是否继续，否则，显示选择项目的弹框
-            if (data && data.length) {
-              this.$confirm('是否要继续上次的实验？', '提示', {
-                confirmButtonText: '是',
-                cancelButtonText: '否',
-                type: 'success'
-              }).then(() => {
-                this.toPython(data[0].projectId)
-              }).catch(() => {
-                this.queryProject()
-              })
+            if (this.isExcel) {
+              this.showMask2 = true;
             } else {
-              this.queryProject()
+              this.showMask2 = false;
             }
-          }).catch(res => {
+            this.iframeSrc = res.previewUrl;
+          }).catch(err => { });
+        }
+      } else {
+        this.showBuy()
+      }
+    },
+    closePlayer () {
+      this.playAuth = "";
+      this.player.pause();
+    },
+    closeIframe () {
+      this.iframeSrc = "";
+      this.showMask = false;
+      this.showMask1 = false;
+    },
+    closePdf () {
+      this.pdfSrc = "";
+      this.currentPage = 1;
+    },
+    changePdfPage (val) {
+      if (val === 0 && this.currentPage > 1) {
+        this.currentPage--;
+      }
+      if (val === 1 && this.currentPage < this.pageCount) {
+        this.currentPage++;
+      }
+    },
+    loadPdfHandler (e) {
+      this.currentPage = 1;
+    },
+    // pdf全屏
+    fullScreen () {
+      this.pdfVisible = true
+    },
+    // 选择项目
+    selectProject (item) {
+      this.curProject = item.projectId
+    },
+    // 展示选择项目弹框
+    queryProject () {
+      this.projectVisible = true
+      this.loading = true
+      this.$get(this.api.getProjectBySystemId, {
+        systemId: this.systemIds,
+        cId: this.courseId, // 课程id
+        permissions: 0 // 0: 练习,1: 考核
+      }).then(({ projects }) => {
+        this.loading = false
+        this.projects = projects
+      }).catch(res => { })
+    },
+    // 进入实验
+    entry () {
+      // 查询上次做的项目
+      this.$get(this.api.getTheMostRecentlyRunProject, {
+        cid: this.courseId
+      }).then(({ data }) => {
+        // 返回了data则提示是否继续，否则，显示选择项目的弹框
+        if (data && data.length) {
+          this.$confirm('是否要继续上次的实验？', '提示', {
+            confirmButtonText: '是',
+            cancelButtonText: '否',
+            type: 'success'
+          }).then(() => {
+            this.toPython(data[0].projectId)
+          }).catch(() => {
             this.queryProject()
           })
-        },
-        // 进入python系统
-        toPython(projectId) {
-          const id = this.systemIds
-          let token = util.local.get(Setting.tokenKey);
-          util.cookies.set('assessmentId', '', -1)
-          util.cookies.set('startTime', '', -1)
-          util.cookies.set('stopTime', '', -1)
-          projectId ? util.cookies.set('projectId', projectId) : util.cookies.set('projectId', '', -1)
-          util.cookies.set('token', token)
-          util.cookies.set('courseId', this.courseId)
-          util.cookies.set('curriculumName', escape(this.curriculumName))
-          util.cookies.set('systemId', id)
-          util.cookies.set('fromManager', 1)
-          // 8个python子系统都跳这个地址，子系统会通过cookie里的systemId识别展示哪套系统
-          location.href = process.env.NODE_ENV === 'development' ?
-            `http://${location.hostname}:8085/#/` :
-            Setting.isPro ?
-              `https://${location.hostname}/pyTrials` :
-              `${location.origin}/pyTrials`
-        },
-        // 进入子系统
-        toSub() {
-            const { systemId } = this.projects.find(e => e.projectId == this.curProject)
-            let token = util.local.get(Setting.tokenKey);
-            let roleId = this.roleId == 4 ? 0 : 1;
-            let userName = window.btoa(encodeURIComponent(this.userName));
-
-            if (systemId == 11) {
-                // 银行系统
-                location.href = `${Setting.bankPath}/#/index/list?curriculumName=${this.curriculumName}&token=${token}&cid=${this.courseId}&systemId=${this.systemIds}&projectId=${this.curProject}&assessmentId=&classId=&stopTime=&test=true&manager=1`
-            } else if (systemId == 12) {
-                // 众筹系统
-                window.open(`http://120.78.139.126:8879?systemId=${systemId}&courseId=${this.courseId}&projectId=${this.curProject}&token=${token}&userId=${this.userId}&classId=1`);
-            } else if (systemId == 21) {
-                window.open(`http://121.37.29.24:80/yyyflogin?userId=${this.userId}&userName=${userName}&userType=${roleId}&reqType=1&reqId=3989a0ad671849b99dcbdcc208782333&caseId=9681f86902314b10bc752909121f9ab9&authorization=87DIVy348Oxzj3ha&classId=1876&courserId=7ff5d4715b114b7398b6f26c20fac460`);
-            } else if (systemId == 22) {
-                window.open(`https://danbao.czcyedu.com/#/loginFromYyyf?userId=${this.userId}&userName=${userName}&userType=${roleId}&reqType=1&reqId=eb7d8355119d449184c548b07dc01ed9&caseId=1198241070647873538&authorization=87DIVy348Oxzj3ha&classId=1876&courserId=faaedd82adb9444285a5785e4a3dd4f9`);
-            } else {
-              // python系统
-              this.toPython(this.curProject)
-            }
+        } else {
+          this.queryProject()
         }
+      }).catch(res => {
+        this.queryProject()
+      })
+    },
+    // 进入python系统
+    toPython (projectId) {
+      const id = this.systemIds
+      let token = util.local.get(Setting.tokenKey);
+      util.cookies.set('assessmentId', '', -1)
+      util.cookies.set('startTime', '', -1)
+      util.cookies.set('stopTime', '', -1)
+      projectId ? util.cookies.set('projectId', projectId) : util.cookies.set('projectId', '', -1)
+      util.cookies.set('token', token)
+      util.cookies.set('mallId', this.mallId)
+      util.cookies.set('courseId', this.courseId)
+      util.cookies.set('curriculumName', escape(this.curriculumName))
+      util.cookies.set('systemId', id)
+      util.cookies.set('fromManager', 1)
+      // 8个python子系统都跳这个地址，子系统会通过cookie里的systemId识别展示哪套系统
+      location.href = process.env.NODE_ENV === 'development' ?
+        `http://${location.hostname}:8085/#/` :
+        Setting.isPro ?
+          `https://${location.hostname}/pyTrials` :
+          `${location.origin}/pyTrials`
+    },
+    // 进入子系统
+    toSub () {
+      const { systemId } = this.projects.find(e => e.projectId == this.curProject)
+      let token = util.local.get(Setting.tokenKey);
+      let roleId = this.roleId == 4 ? 0 : 1;
+      let userName = window.btoa(encodeURIComponent(this.userName));
+
+      if (systemId == 11) {
+        // 银行系统
+        location.href = `${Setting.bankPath}/#/index/list?curriculumName=${this.curriculumName}&token=${token}&cid=${this.courseId}&systemId=${this.systemIds}&projectId=${this.curProject}&assessmentId=&classId=&stopTime=&test=true&manager=1`
+      } else if (systemId == 12) {
+        // 众筹系统
+        window.open(`http://120.78.139.126:8879?systemId=${systemId}&courseId=${this.courseId}&projectId=${this.curProject}&token=${token}&userId=${this.userId}&classId=1`);
+      } else if (systemId == 21) {
+        window.open(`http://121.37.29.24:80/yyyflogin?userId=${this.userId}&userName=${userName}&userType=${roleId}&reqType=1&reqId=3989a0ad671849b99dcbdcc208782333&caseId=9681f86902314b10bc752909121f9ab9&authorization=87DIVy348Oxzj3ha&classId=1876&courserId=7ff5d4715b114b7398b6f26c20fac460`);
+      } else if (systemId == 22) {
+        window.open(`https://danbao.czcyedu.com/#/loginFromYyyf?userId=${this.userId}&userName=${userName}&userType=${roleId}&reqType=1&reqId=eb7d8355119d449184c548b07dc01ed9&caseId=1198241070647873538&authorization=87DIVy348Oxzj3ha&classId=1876&courserId=faaedd82adb9444285a5785e4a3dd4f9`);
+      } else {
+        // python系统
+        this.toPython(this.curProject)
+      }
     }
+  }
 };
 </script>
 
 <style lang="scss" scoped>
-@import "../../../styles/page/station.scss";
+@import '../../../styles/page/station.scss';
 $height: 700px;
 .page {
     margin: 12px 0;
@@ -719,109 +834,111 @@ $height: 700px;
         line-height: 24px;
     }
 }
-.video_wid,.cover{
+.video_wid,
+.cover {
     position: relative;
     width: 76%;
     height: $height !important;
     border: 0;
 }
 .cover {
-  flex: 1;
-  width: auto;
+    flex: 1;
+    width: auto;
 }
-.cover{
-    img{
+.cover {
+    img {
         border-radius: 8px;
     }
-    &.is-word{
+    &.is-word {
         overflow: hidden;
     }
 }
 .entry {
-  width: 100%;
-  height: 50px;
-  font-size: 18px;
+    width: 100%;
+    height: 50px;
+    font-size: 18px;
 }
 .types {
-  display: flex;
-  margin: 15px 0;
-  .item {
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    width: 120px;
-    height: 40px;
-    color: #fff;
-    background-color: #b5b5b5;
-    border-radius: 4px;
-    cursor: pointer;
-    &:first-child {
-      margin-right: 10px;
-    }
-    &:hover {
-      background-color: #528adf;
+    display: flex;
+    margin: 15px 0;
+    .item {
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        width: 120px;
+        height: 40px;
+        color: #fff;
+        background-color: #b5b5b5;
+        border-radius: 4px;
+        cursor: pointer;
+        &:first-child {
+            margin-right: 10px;
+        }
+        &:hover {
+            background-color: #528adf;
+        }
+        &.active {
+            background-color: $main-color;
+        }
     }
-    &.active {
-      background-color: $main-color;
+    .icon {
+        margin-right: 5px;
+        font-size: 18px;
     }
-  }
-  .icon {
-    margin-right: 5px;
-    font-size: 18px;
-  }
 }
-.fileIframe{
+.fileIframe {
     height: $height !important;
 }
-.video_wid,.inner{
+.video_wid,
+.inner {
     width: 100%;
     height: 100% !important;
     border: 0;
     overflow: auto;
 }
-.cover.is-word{
-    .inner{
+.cover.is-word {
+    .inner {
         height: calc(100% + 38px) !important;
         margin-top: -38px;
     }
 }
-.video_wid:focus{
+.video_wid:focus {
     outline: none;
 }
-.catalog{
-  width: 330px;
-  margin-left: 20px;
+.catalog {
+    width: 330px;
+    margin-left: 20px;
 }
-.list{
-    height: calc(700px - 70px) ;
+.list {
+    height: calc(700px - 70px);
     overflow-y: auto;
     padding: 24px 16px;
     background: #fff;
-    .title{
+    .title {
         margin-bottom: 8px;
         color: rgba(0, 0, 0, 0.85);
         font-size: 20px;
     }
     .pro-title {
-      margin-bottom: 5px;
-      font-size: 14px;
+        margin-bottom: 5px;
+        font-size: 14px;
     }
     /deep/.el-progress-bar {
-      width: 86%;
+        width: 86%;
     }
-    .desc-wrap{
+    .desc-wrap {
         position: relative;
-        .desc{
+        .desc {
             font-size: 14px;
             color: rgba(0, 0, 0, 0.65);
             line-height: 22px;
             @include mul-ellipsis(2);
-            &.active{
+            &.active {
                 display: block;
                 overflow: visible;
             }
         }
-        .arrow{
+        .arrow {
             position: absolute;
             bottom: 2px;
             right: 0;
@@ -829,42 +946,42 @@ $height: 700px;
             justify-content: space-between;
             width: 46px;
             background-color: #fff;
-            span{
+            span {
                 font-size: 14px;
                 color: rgba(0, 0, 0, 0.65);
             }
-            img{
+            img {
                 width: 16px;
                 cursor: pointer;
             }
-            &.active{
-                span{
+            &.active {
+                span {
                     opacity: 0;
                 }
-                img{
+                img {
                     transform: rotate(180deg);
                 }
             }
         }
     }
-    .chapters{
+    .chapters {
         margin-top: 16px;
         max-height: calc(100% - 53px);
         overflow: auto;
     }
-    .chapter{
+    .chapter {
         margin-bottom: 20px;
     }
-    .chapterName{
+    .chapterName {
         color: rgba(0, 0, 0, 0.85);
         font-size: 16px;
     }
-    .section{
+    .section {
         padding: 5px 15px;
         margin-top: 8px;
         background: rgba(0, 0, 0, 0.02);
     }
-    .sectionName{
+    .sectionName {
         position: relative;
         padding-right: 15px;
         margin: 10px 0;
@@ -872,47 +989,47 @@ $height: 700px;
         color: rgba(0, 0, 0, 0.65);
         cursor: pointer;
         @include ellipsis;
-        &.active{
-            color: #9278FF;
+        &.active {
+            color: #9278ff;
         }
         .icon {
-          position: absolute;
-          right: 0;
-          font-size: 16px;
-          color: #00c935;
+            position: absolute;
+            right: 0;
+            font-size: 16px;
+            color: #00c935;
         }
         .circle {
-          width: 14px;
-          height: 14px;
-          border-radius: 50%;
-          border: 1px solid #ccc;
+            width: 14px;
+            height: 14px;
+            border-radius: 50%;
+            border: 1px solid #ccc;
         }
     }
 }
 .buy {
-  text-align: center;
-  .tips {
-    margin-bottom: 10px;
-    font-size: 14px;
-  }
-  img {
-    width: 85%;
-  }
+    text-align: center;
+    .tips {
+        margin-bottom: 10px;
+        font-size: 14px;
+    }
+    img {
+        width: 85%;
+    }
 }
-.el-image-viewer__wrapper{
+.el-image-viewer__wrapper {
     transform: translateY(-10px);
-    transition: transform .5s;
+    transition: transform 0.5s;
 
-    &.active{
-        transform: translateY(0)
+    &.active {
+        transform: translateY(0);
     }
 }
-.el-image-viewer__close{
+.el-image-viewer__close {
     z-index: 2000;
     top: 15px;
     right: 15px;
-    &.doc-close{
-        i{
+    &.doc-close {
+        i {
             color: #000 !important;
         }
     }
@@ -925,20 +1042,20 @@ $height: 700px;
     background: rgba(0, 0, 0, 0.06);
 }
 
-.mask{
+.mask {
     z-index: 9;
     position: absolute;
-    background-color: rgb(57,58,61);
+    background-color: rgb(57, 58, 61);
 }
-.word-mask{
+.word-mask {
     z-index: 9;
     position: absolute;
     top: 0;
     right: 0;
     width: 100%;
-    background-color: rgb(243,242,241);
+    background-color: rgb(243, 242, 241);
 }
-.word-mask1{
+.word-mask1 {
     z-index: 9;
     position: absolute;
     top: 0;
@@ -946,12 +1063,12 @@ $height: 700px;
     width: 100%;
     background-color: #185abd;
 }
-.word-mask2{
+.word-mask2 {
     z-index: 9;
     position: absolute;
     background-color: transparent;
 }
-.excel-mask1{
+.excel-mask1 {
     z-index: 9;
     position: absolute;
     top: 0;
@@ -959,32 +1076,32 @@ $height: 700px;
     width: 60%;
     background-color: #107c41;
 }
-/deep/.pdf-dia{
+/deep/.pdf-dia {
     border-radius: 0 !important;
-    .el-dialog__header{
+    .el-dialog__header {
         display: none;
     }
-    .el-dialog__body{
+    .el-dialog__body {
         padding: 0;
     }
-    .el-dialog__headerbtn{
+    .el-dialog__headerbtn {
         top: 10px;
-        .el-dialog__close{
+        .el-dialog__close {
             color: #fff;
             font-size: 16px;
         }
     }
 }
-.pdf{
+.pdf {
     position: relative;
     margin-top: 0 !important;
     .full {
-      position: absolute;
-      top: 7px;
-      right: 10px;
-      cursor: pointer;
+        position: absolute;
+        top: 7px;
+        right: 10px;
+        cursor: pointer;
     }
-    .arrow{
+    .arrow {
         padding: 10px 0;
         display: flex;
         justify-content: center;
@@ -992,60 +1109,60 @@ $height: 700px;
         font-size: 16px;
         color: #fff;
         background-color: #333;
-        .turn{
+        .turn {
             margin: 0 10px;
             font-size: 18px;
             cursor: pointer;
         }
     }
-    .pdf-wrap{
+    .pdf-wrap {
         width: 80%;
         margin: 0 auto;
     }
 }
 
 .tab-content {
-  width: 80%;
+    width: 80%;
 }
 /deep/.project-dia {
-  .el-dialog__body {
-    padding: 28px 32px;
-  }
+    .el-dialog__body {
+        padding: 28px 32px;
+    }
 }
 .projects {
-  display: flex;
-  flex-wrap: wrap;
-  max-height: 400px;
-  overflow: auto;
-  li {
-    display: inline-flex;
-    align-items: center;
-    width: 238px;
-    padding: 16px;
-    margin: 0 20px 20px 0;
-    background-color: #F6F8FA;
-    border-radius: 16px;
-    cursor: pointer;
-    &:hover {
-      span {
-        color: #007EFF;
-      }
-    }
-    &:nth-child(3n) {
-      margin-right: 0;
+    display: flex;
+    flex-wrap: wrap;
+    max-height: 400px;
+    overflow: auto;
+    li {
+        display: inline-flex;
+        align-items: center;
+        width: 238px;
+        padding: 16px;
+        margin: 0 20px 20px 0;
+        background-color: #f6f8fa;
+        border-radius: 16px;
+        cursor: pointer;
+        &:hover {
+            span {
+                color: #007eff;
+            }
+        }
+        &:nth-child(3n) {
+            margin-right: 0;
+        }
+        &.active {
+            background-color: #f2f7ff;
+            span {
+                color: #3988ff;
+            }
+        }
     }
-    &.active {
-      background-color: #f2f7ff;
-      span {
-        color: #3988ff;
-      }
+    span {
+        max-width: 140px;
+        margin-left: 14px;
+        font-size: 14px;
+        color: #333;
     }
-  }
-  span {
-    max-width: 140px;
-    margin-left: 14px;
-    font-size: 14px;
-    color: #333;
-  }
 }
 </style>
\ No newline at end of file