Branch_d40a2540
yujialong 2 years ago
parent d5f8a827dd
commit 16206af273
  1. BIN
      src/assets/img/product/1.png
  2. BIN
      src/assets/img/product/2.png
  3. BIN
      src/assets/img/product/3.png
  4. BIN
      src/assets/img/product/4.png
  5. BIN
      src/assets/img/product/5.png
  6. 227
      src/pages/product/list/index.vue
  7. 252
      src/pages/product/show/index.vue
  8. 299
      src/pages/project/add/index.vue
  9. 194
      src/pages/project/list/index.vue
  10. 63
      src/pages/station/list/index.vue
  11. 477
      src/pages/station/preview/index.vue

Binary file not shown.

After

Width:  |  Height:  |  Size: 667 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 451 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 581 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 490 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 585 B

@ -1,10 +1,14 @@
<template>
<div class="wrap">
<el-carousel :interval="6000" :height="carouselHeight">
<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}">
<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>
@ -14,15 +18,25 @@
<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="">
<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>
<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">
<img class="icon"
src="@/assets/img/search.png"
alt="">
<input type="text"
placeholder="请输入产品名称"
v-model="form.productName">
</div>
</div>
<div class="filter">
@ -30,48 +44,86 @@
<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 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 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 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>
<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>
<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>
<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="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">
<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>
@ -81,35 +133,57 @@
<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="">
<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">
<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="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">
<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>
<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"
<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>
</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-pagination background
layout="total, prev, pager, next"
:page-size="pageSize"
:total="total"
@current-change="handleCurrentChange"
:current-page="page"></el-pagination>
</div>
</template>
</div>
@ -121,7 +195,7 @@
import { Loading } from "element-ui";
import Setting from "@/setting";
export default {
data() {
data () {
return {
carouselHeight: '336px',
banners: [],
@ -209,14 +283,14 @@ export default {
};
},
watch: {
'form.productName': function(val) {
'form.productName': function (val) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initData();
}, 500);
}
},
mounted() {
mounted () {
console.log(11, parseInt(window.innerWidth / 5.7))
this.carouselHeight = parseInt(window.innerWidth / 5.7) + 'px'
this.getBanner()
@ -227,17 +301,17 @@ export default {
},
methods: {
// banner
getBanner() {
getBanner () {
this.$post(this.api.listMarketing, {
pageNum: 1,
pageSize: 1000,
isOpen: 0
}).then(({ page }) => {
this.banners = page.records
}).catch(res => {})
}).catch(res => { })
},
//
getData() {
getData () {
this.loadIns = Loading.service()
this.$post(this.api.listOfGoods, {
...this.form,
@ -260,36 +334,36 @@ export default {
this.loadIns.close()
})
},
initData() {
initData () {
this.page = 1;
this.getData();
},
//
getLabel() {
getLabel () {
this.$get(this.api.tagsList).then(res => {
this.labels = res.tagsList
}).catch(err => {})
}).catch(err => { })
},
//
getSubject() {
getSubject () {
this.$get(this.api.courseDiscipline).then(res => {
this.subjectList = res.list;
}).catch(err => {
});
},
//
clearClass() {
clearClass () {
this.form.professionalCategoryId = "";
this.form.professionalId = "";
},
//
getProfessionalClass() {
getProfessionalClass () {
this.clearClass();
this.getProfessionalClassData();
this.initData();
},
getProfessionalClassData() {
getProfessionalClassData () {
let data = {
disciplineId: this.form.categoryId
};
@ -299,16 +373,16 @@ export default {
});
},
//
clearProfess() {
clearProfess () {
this.form.professionalId = "";
},
//
getProfessional() {
getProfessional () {
this.clearProfess();
this.getProfessionalData();
this.initData();
},
getProfessionalData() {
getProfessionalData () {
let data = {
professionalClassId: this.form.professionalCategoryId
};
@ -318,23 +392,27 @@ export default {
});
},
//
getClass() {
getClass () {
this.$get(this.api.productTypeList).then(res => {
this.classifications = res.typeList
}).catch(err => {})
}).catch(err => { })
},
//
getClassification() {
getClassification () {
this.$post(this.api.listClassification, {
pageNum: 1,
pageSize: 1000,
platformSource
}).then(({ page }) => {
this.classificationList = page.records
}).catch(res => {})
}).catch(res => { })
},
// banner
openLink (item) {
item.url && window.open(item.url)
},
// tab
tabChange({ id }) {
tabChange ({ id }) {
this.curTab = id
this.form.hotTag = 1
this.form.selection = ''
@ -346,21 +424,21 @@ export default {
this.initData()
},
//
filterChange(id, prop) {
filterChange (id, prop) {
this.form[prop] = id
this.initData()
},
//
sort() {
sort () {
this.form.sort = this.form.sort === 2 ? 5 : 2
this.initData()
},
handleCurrentChange(val) {
handleCurrentChange (val) {
this.page = val;
this.getData();
},
//
toDetail(id) {
toDetail (id) {
this.$router.push(`show?id=${id}`);
}
}
@ -381,7 +459,7 @@ export default {
top: 116px;
left: 188px;
font-size: 50px;
color: #2E2D31;
color: #2e2d31;
}
}
.inner {
@ -402,7 +480,7 @@ export default {
margin: 0 20px;
font-size: 18px;
line-height: 25px;
color: #0B1D30;
color: #0b1d30;
cursor: pointer;
&:after {
content: '';
@ -414,7 +492,7 @@ export default {
transform: translateX(-50%);
}
&.active:after {
background-color: #007EFF;
background-color: #007eff;
}
}
}
@ -430,7 +508,7 @@ export default {
border-radius: 31px;
input {
height: 40px;
margin-left: 7px ;
margin-left: 7px;
font-size: 14px;
color: #333;
border: 0;
@ -463,7 +541,7 @@ export default {
cursor: pointer;
&.active {
font-weight: 600;
color: #007EFF;
color: #007eff;
}
}
}
@ -525,7 +603,7 @@ export default {
img {
width: 100%;
height: 140px;
transition: .3s;
transition: 0.3s;
}
.my-school {
position: absolute;
@ -539,7 +617,7 @@ export default {
}
.title {
margin-bottom: 10px;
color: #0B1D30;
color: #0b1d30;
font-size: 14px;
font-weight: 600;
word-wrap: break-word;
@ -550,7 +628,7 @@ export default {
}
.desc {
min-height: 34px;
color: #757F92;
color: #757f92;
font-size: 12px;
display: -webkit-box;
-webkit-box-orient: vertical;
@ -564,8 +642,8 @@ export default {
}
.tag {
margin-right: 8px;
color: #007EFF;
background-color: #F9F9F9;
color: #007eff;
background-color: #f9f9f9;
border: 0;
}
.type {
@ -573,7 +651,7 @@ export default {
padding: 4px 11px;
font-size: 12px;
color: #666;
border: 1px solid #DADADA;
border: 1px solid #dadada;
border-radius: 20px;
}
.metas {
@ -588,7 +666,7 @@ export default {
.meta {
display: inline-flex;
align-items: center;
color: #B5BFD5;
color: #b5bfd5;
font-size: 12px;
.icon {
width: 14px;
@ -597,7 +675,8 @@ export default {
}
}
&: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);
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);
}

@ -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"
<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>
@ -84,11 +139,20 @@
</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,7 +163,7 @@
import Util from "@/libs/util"
import Setting from "@/setting"
export default {
data() {
data () {
return {
id: this.$route.query.id,
curTab: 0,
@ -116,17 +180,18 @@ export default {
},
chapterList: [],
hots: [],
linkVisible: false
linkVisible: false,
height: ''
};
},
computed: {
//
withLink() {
withLink () {
const links = this.form.mallNonAssociatedLinks
return this.form.mall.isAssociatedProduct && links && links.length
},
//
isCourse() {
isCourse () {
let id = this.form.classificationIds
if (id) {
id = id[0]
@ -146,13 +211,13 @@ export default {
return false
}
},
mounted() {
mounted () {
this.getData()
this.getHot()
},
methods: {
//
getData() {
getData () {
this.$get(`${this.api.detailsOfGoods}?mallId=${this.id}`).then(res => {
const e = res.orderDetails
// +
@ -161,52 +226,55 @@ export default {
this.form = e
this.chapterList = ''
e.mall.associatedProduct && this.getChapter()
}).catch(err => {})
this.$nextTick(() => {
this.height = document.querySelector('#fields').clientHeight + 'px'
})
}).catch(err => { })
},
//
async getChapter() {
async getChapter () {
let res = await this.$get(this.api.curriculumChapter + '/' + this.form.mall.associatedProduct)
this.chapterList = res.chapterList
},
// tab
tabChange({ id }) {
tabChange ({ id }) {
this.curTab = id
},
//
toPreview(i, j) {
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.$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) {
studySection (item) {
item.whetherToStudyOrNot ?
this.$post(`${this.api.deleteLearningProgress}?id=${item.learningProgressId}`).then(res => {
this.getChapter()
}).catch(res => {}) :
}).catch(res => { }) :
this.$post(this.api.saveLearningProgress, {
cid: this.form.mall.associatedProduct,
projectId: item.projectId,
}).then(res => {
this.getChapter()
}).catch(res => {})
}).catch(res => { })
},
//
toTrail() {
toTrail () {
window.open('https://f.wps.cn/g/VekixBcm/')
},
//
toStation() {
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 => {})
}).catch(res => { })
} else if (this.withLink) { //
this.linkVisible = true
}
},
//
getHot() {
getHot () {
this.$post(this.api.listOfGoods, {
hotTag: 1,
sort: 1,
@ -223,10 +291,10 @@ export default {
e.isCourse = (cid === 1 || cid === 2) && !e.isAssociatedProduct
})
this.hots = list
}).catch(res => {})
}).catch(res => { })
},
//
toDetail(id) {
toDetail (id) {
this.$router.push(`show?id=${id}`)
this.id = id
this.getData()
@ -237,7 +305,7 @@ export default {
<style lang="scss" scoped>
.wrap {
background: #F3F6FA;
background: #f3f6fa;
.inner {
width: 1154px;
margin: 0 auto;
@ -263,6 +331,12 @@ export default {
&:last-child {
margin-right: 0;
}
&:only-child {
// max-height: 266px;
// height: auto;
height: 100%;
margin: 0;
}
}
}
.right {
@ -272,14 +346,14 @@ export default {
h6 {
font-size: 24px;
font-weight: 600;
color: #2E2D31;
color: #2e2d31;
}
.meta {
margin: 10px 0;
font-size: 12px;
color: #2E2D31;
color: #2e2d31;
.val {
color: #007EFF;
color: #007eff;
}
}
.des {
@ -287,20 +361,24 @@ export default {
font-size: 14px;
color: #666;
line-height: 20px;
@include mul-ellipsis(3);
}
.field {
font-size: 14px;
color: #2E2D31;
color: #2e2d31;
.label {
color: #333;
}
}
.fields {
display: flex;
justify-content: space-between;
// justify-content: space-between;
flex-wrap: wrap;
height: 60px;
margin: 10px 0 10px;
overflow: hidden;
.field {
margin-right: 40px;
margin-bottom: 10px;
}
}
@ -308,19 +386,19 @@ export default {
width: 119px;
height: 46px;
color: #fff;
background: #64C25A;
background: #64c25a;
border-radius: 6px;
border: 0;
cursor: pointer;
&:hover {
opacity: .9;
opacity: 0.9;
}
&:first-child {
margin-left: 11px;
}
}
.entry {
background: #007EFF;
background: #007eff;
}
}
.tab {
@ -331,7 +409,7 @@ export default {
margin-right: 20px;
font-size: 18px;
line-height: 25px;
color: #0B1D30;
color: #0b1d30;
cursor: pointer;
&:after {
content: '';
@ -343,7 +421,7 @@ export default {
transform: translateX(-50%);
}
&.active:after {
background-color: #007EFF;
background-color: #007eff;
}
}
}
@ -355,26 +433,25 @@ export default {
padding: 20px 24px;
background-color: #fff;
border-radius: 10px;
}
}
.courses {
margin-top: 40px;
.chapters{
.chapters {
margin-top: 16px;
max-height: calc(100% - 53px);
overflow: auto;
}
.chapter{
.chapter {
margin-bottom: 20px;
}
.chapterName{
.chapterName {
padding: 0 12px;
margin-bottom: 15px;
color: #333;
font-size: 14px;
}
.sectionName{
.sectionName {
position: relative;
display: flex;
justify-content: space-between;
@ -388,8 +465,8 @@ export default {
margin-right: 8px;
}
&:hover {
color: #007EFF;
background: #F6FBFF;
color: #007eff;
background: #f6fbff;
}
.val {
display: inline-flex;
@ -404,9 +481,9 @@ export default {
.products {
width: 295px;
margin-left: 24px;
&>h6 {
& > h6 {
font-size: 14px;
color: #0B1D30;
color: #0b1d30;
}
}
.product {
@ -422,7 +499,7 @@ export default {
img {
width: 100%;
height: 140px;
transition: .3s;
transition: 0.3s;
}
.my-school {
position: absolute;
@ -436,7 +513,7 @@ export default {
}
.title {
margin-bottom: 10px;
color: #0B1D30;
color: #0b1d30;
font-size: 14px;
font-weight: 600;
word-wrap: break-word;
@ -447,7 +524,7 @@ export default {
}
.desc {
min-height: 34px;
color: #757F92;
color: #757f92;
font-size: 12px;
display: -webkit-box;
-webkit-box-orient: vertical;
@ -462,8 +539,8 @@ export default {
}
.tag {
margin-right: 8px;
color: #007EFF;
background-color: #F9F9F9;
color: #007eff;
background-color: #f9f9f9;
border: 0;
}
.type {
@ -471,7 +548,7 @@ export default {
padding: 4px 11px;
font-size: 12px;
color: #666;
border: 1px solid #DADADA;
border: 1px solid #dadada;
border-radius: 20px;
}
.metas {
@ -483,7 +560,7 @@ export default {
.meta {
display: inline-flex;
align-items: center;
color: #B5BFD5;
color: #b5bfd5;
font-size: 12px;
.icon {
width: 14px;
@ -492,7 +569,8 @@ export default {
}
}
&: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);
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);
}
@ -503,7 +581,7 @@ export default {
.link-line {
margin: 5px 0;
.url {
color: #007EFF;
color: #007eff;
text-decoration: underline;
}
}

@ -1,39 +1,53 @@
<template>
<div ref="main" class="main">
<div ref="main"
class="main">
<el-form :disabled="isDetail">
<el-card shadow="hover" class="m-b-20">
<el-card shadow="hover"
class="m-b-20">
<div class="flex-between">
<el-page-header @back="back" content="项目配置"></el-page-header>
<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>
<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">
<el-card shadow="hover"
class="m-b-20">
<h6 class="p-title">基本信息</h6>
<div>
<el-form label-width="80px" :disabled="isDetail">
<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"
<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>
: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-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 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>
@ -41,100 +55,158 @@
</div>
</el-card>
<el-card shadow="hover" class="m-b-20">
<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" />
<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">
<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" />
<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">
<el-card shadow="hover"
class="m-b-20">
<div class="m-b-20 flex-between">
<h6 class="p-title" style="margin-bottom: 0">实验任务</h6>
<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 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>
<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>
<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"
<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">
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">
<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" />
<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">
<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>
<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">
<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>
<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">
<el-card shadow="hover"
class="m-b-20">
<div class="m-b-20 flex-between">
<h6 class="p-title" style="margin-bottom: 0">实验提示</h6>
<h6 class="p-title"
style="margin-bottom: 0">实验提示</h6>
<div>
启用
<el-switch :active-value="0" :inactive-value="1" v-model="projectManage.hintOpen"></el-switch>
<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 prop="tips"
label="">
<quill :border="true"
:readonly="isDetail"
v-model="projectManage.experimentHint"
:minHeight="150"
:height="150"
:index="3" />
</el-form-item>
</el-form>
</div>
@ -142,14 +214,19 @@
</el-form>
<!--选择判分点对话框-->
<el-dialog title="添加判分点" :visible.sync="dialogVisible" width="40%" :close-on-click-modal="false">
<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>
<el-input placeholder="请输入需要查找的判分点"
prefix-icon="el-icon-search"
v-model.trim="judgementpointsquery"
clearable></el-input>
</div>
</div>
<el-table
v-loading="visibleLoading"
<el-table v-loading="visibleLoading"
:data="judgementData"
ref="judgementTable"
class="table"
@ -157,24 +234,36 @@
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">
: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">
<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>
<el-button size="mini"
@click="toJudgePoint('view', scope.row)">查看</el-button>
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<div slot="footer"
class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="addJudgment"> </el-button>
<el-button type="primary"
@click="addJudgment"> </el-button>
</div>
</el-dialog>
</div>
@ -191,7 +280,7 @@ export default {
components: {
quill
},
data() {
data () {
return {
projectId: this.$route.query.projectId,
founder: this.$route.query.founder,
@ -229,7 +318,7 @@ export default {
searchTimer: null,
isToPoint: false, //
visibleLoading: false, //
listLoading:false,//
listLoading: false,//
submiting: false, //
updateTime: 0,
next: null,
@ -240,7 +329,7 @@ export default {
...mapState("project", [
"projectFields", "lastSystemId"
]),
handDistributionScore: function() {
handDistributionScore: function () {
//100
let score = 0;
this.projectJudgmentData.forEach(e => {
@ -260,12 +349,12 @@ export default {
watch: {
// ,
projectManage: {
handler(){
handler () {
this.updateTime++
},
deep:true
deep: true
},
judgementpointsquery(n) {
judgementpointsquery (n) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.handleQueryJudgment();
@ -273,10 +362,10 @@ export default {
}
},
// ,
beforeRouteLeave(to, from, next) {
beforeRouteLeave (to, from, next) {
console.log(44, this.updateTime)
if(this.updateTime){
if(!this.backType) {
if (this.updateTime) {
if (!this.backType) {
this.$confirm(`您所更改的内容未更新,是否更新?`, '提示', {
type: 'warning'
}).then(() => {
@ -285,15 +374,15 @@ export default {
}).catch(() => {
next()
})
}else {
} else {
next()
}
}else{
} else {
next()
}
},
mounted() {
mounted () {
this.getSystemData();
if (this.$route.query.projectId) {
this.projectId = this.$route.query.projectId;
@ -308,7 +397,7 @@ export default {
this.rowDrop();
this.$refs.main.scrollTop = 0;
},
beforeDestroy() {
beforeDestroy () {
if (!this.isToPoint) {
this.setProject({});
}
@ -317,12 +406,12 @@ export default {
...mapActions("project", [
"setSystemId", "setProject"
]),
getSystemData() {
getSystemData () {
this.$get(this.api.getSystemIdBySchool).then(res => {
this.systemList = res.data;
});
},
getInfoData() { //
getInfoData () { //
this.$get(`${this.api.getProjectDetail}?projectId=${this.projectId}`).then(res => {
let { projectManage, projectJudgmentVos } = res;
this.projectManage = projectManage;
@ -339,7 +428,7 @@ export default {
console.log(err);
});
},
projectNameExistis() { //
projectNameExistis () { //
const { projectName } = this.projectManage
if (this.originName === projectName) {
this.projectNameRepeat = false
@ -353,7 +442,7 @@ export default {
})
}
},
systemChange() { //
systemChange () { //
if (this.projectJudgmentData.length) {
this.$confirm("更换系统会清空实验任务,确认更换?", "提示", {
type: "warning"
@ -367,10 +456,10 @@ export default {
}
},
//
removeTag(val) {
removeTag (val) {
return val.replace('<p><br></p>', '')
},
judgmentRelease(state) { //
judgmentRelease (state) { //
let {
projectName,
experimentTarget,
@ -414,7 +503,7 @@ export default {
}
return true;
},
save(state) { //
save (state) { //
if (this.submiting) return false
if (!this.judgmentRelease(state)) { //
return;
@ -453,7 +542,7 @@ export default {
}
}
},
updateProject(params) { //
updateProject (params) { //
this.$post(this.api[params.projectManage.state ? 'updateProjectManage' : 'editProjectDraft'], params).then(res => {
util.successMsg("更新实验项目成功");
this.updateTime = 0
@ -462,7 +551,7 @@ export default {
this.submiting = false
});
},
addProject(params) { //
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("添加实验项目成功");
@ -472,10 +561,10 @@ export default {
this.submiting = false
});
},
manualDistributionScore() { //
manualDistributionScore () { //
},
avgDistributionScore() {
avgDistributionScore () {
//
if (this.projectJudgmentData.length) {
this.$get(this.api.avgValues, {
@ -491,10 +580,10 @@ export default {
});
}
},
scoreChange(row, index, val) { //
scoreChange (row, index, val) { //
this.projectJudgmentData.splice(index, 1, row);
},
delJudgePoint(index) { //
delJudgePoint (index) { //
this.$confirm("确定要删除吗?", "提示", {
type: "warning"
}).then(() => {
@ -502,10 +591,10 @@ export default {
}).catch(() => {
});
},
handleSelectionProjectJudgment(val) {
handleSelectionProjectJudgment (val) {
this.selectedProjectJudgment = val;
},
batchDeleteProjectJudgment() { //
batchDeleteProjectJudgment () { //
if (this.selectedProjectJudgment.length) {
this.$confirm("确定要删除吗?", "提示", {
type: "warning"
@ -522,7 +611,7 @@ export default {
util.errorMsg("请选择判分点");
}
},
handleQueryJudgment() { //
handleQueryJudgment () { //
let { systemId } = this.projectManage;
this.dialogVisible = true;
this.$nextTick(() => {
@ -544,7 +633,7 @@ export default {
this.getProgrammingClassData(params);
}
},
getProcessClassData(params) { //
getProcessClassData (params) { //
this.visibleLoading = true;
this.$get(`${this.api.getBcJudgmentPoint}`, params).then(res => {
let list = res.judgmentPoints
@ -558,7 +647,7 @@ export default {
this.visibleLoading = false
});
},
getProgrammingClassData(params) { //
getProgrammingClassData (params) { //
this.visibleLoading = true;
this.$get(this.api.getBcJudgmentPoint, params).then(res => {
let list = res.judgmentPoints
@ -572,10 +661,10 @@ export default {
this.visibleLoading = false
});
},
handleSelectionJudgment(val) { //
handleSelectionJudgment (val) { //
this.selectedJudgment = val;
},
addJudgment() { //
addJudgment () { //
if (this.selectedJudgment.length) {
// console.log(this.selectedJudgment, "queren");
this.dialogVisible = false;
@ -594,11 +683,11 @@ export default {
util.errorMsg("请选择判分点");
}
},
handleCacheData() { //
handleCacheData () { //
this.isToPoint = true;
this.setProject({ projectManage: this.projectManage, projectJudgmentData: this.projectJudgmentData });
},
toJudgePoint(type, row) { //
toJudgePoint (type, row) { //
this.handleCacheData();
let jumpPath = Setting.jumpPath;
// let jumpPath = "http://192.168.31.154:8087/"; //
@ -640,22 +729,22 @@ export default {
}
location.href = href;
},
permissionChange(){
if (this.projectManage.permissions){
permissionChange () {
if (this.projectManage.permissions) {
this.projectManage.hintOpen = 1
}else{
} else {
this.projectManage.hintOpen = 0
}
},
//
rowDrop() {
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 }) {
onEnd ({ newIndex, oldIndex }) {
_this.projectJudgmentData.splice(newIndex, 0, _this.projectJudgmentData.splice(oldIndex, 1)[0]);
let newArray = _this.projectJudgmentData.slice(0);
_this.projectJudgmentData = [];
@ -671,7 +760,7 @@ export default {
});
},
//
async updateProjectJudgment() {
async updateProjectJudgment () {
let param = this.projectJudgmentData.map((e, i) => {
let obj = {
judgmentId: e.judgmentId,
@ -702,10 +791,10 @@ export default {
});
},
//
back() {
back () {
this.backType = true
//
if(this.updateTime){
if (this.updateTime) {
this.$confirm('编辑的内容未保存,是否保存?', "提示", {
type: "warning"
}).then(() => {
@ -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>

@ -1,7 +1,10 @@
<template>
<div>
<el-card v-if="showBack" shadow="hover" class="m-b-20">
<el-page-header content="实验项目管理" @back="goBack"></el-page-header>
<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>
@ -9,41 +12,41 @@
<ul class="filter">
<li>
<label>创建人</label>
<el-select v-model="queryData.founder" placeholder="请选择创建人" @change="founderChange">
<el-option
v-for="(item,index) in founderList"
<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>
: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"
<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>
: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"
<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>
:value="item.value"></el-option>
</el-select>
</li>
<li>
<label>课程</label>
<el-cascader
v-model="cid"
<el-cascader v-model="cid"
:options="curs"
:props="{ checkStrictly: true, value: 'id' }"
popper-class="course-cas"
@ -70,71 +73,121 @@
</el-select>
</li> -->
<li>
<el-input placeholder="请输入项目名称" prefix-icon="el-icon-search" v-model="keyword" clearable></el-input>
<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>
<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"
<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">
<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">
<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">
<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">
<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">
<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="'禁用'"
<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>
@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>
<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-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-input placeholder="请输入项目名称"
v-model="projectName"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<span slot="footer"
class="dialog-footer">
<el-button @click="copyVisible = false"> </el-button>
<el-button type="primary" @click="copySubmit"> </el-button>
<el-button type="primary"
@click="copySubmit"> </el-button>
</span>
</el-dialog>
</div>
@ -145,7 +198,7 @@
import { mapState, mapActions, mapMutations } from "vuex";
import util from "@/libs/util";
export default {
data() {
data () {
return {
showBack: Boolean(this.$route.query.show),
cid: [],
@ -239,23 +292,23 @@ export default {
])
},
watch: {
keyword: function(val) {
keyword: function (val) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initData();
}, 500);
},
queryData: {
handler: function(newVal) {
this.setQueryStatus({...newVal})
handler: function (newVal) {
this.setQueryStatus({ ...newVal })
},
deep: true
}
},
mounted() {
mounted () {
this.getSystemData()
this.getData()
if(this.queryDataStatus.platformId) {
if (this.queryDataStatus.platformId) {
this.queryData = this.queryDataStatus
}
},
@ -266,7 +319,7 @@ export default {
...mapMutations({
setQueryStatus: "project/SET_QUERYDATASTATUS"
}),
getData() {
getData () {
this.setSystemId(this.systemId);
if (this.isFirst) this.page = +this.$route.query.page || 1
let data = {
@ -284,14 +337,14 @@ export default {
});
},
//
getSystemData() {
getSystemData () {
this.$get(this.api.getSystemIdBySchool).then(({ data }) => {
this.systemListAll = data
this.getschoolCourse()
}).catch(err => {})
}).catch(err => { })
},
//
getschoolCourse() {
getschoolCourse () {
this.$get(this.api.getSchoolEffectiveCourse).then(({ data }) => {
this.curriculumList = data
const { cid } = this.queryData
@ -306,10 +359,10 @@ export default {
this.curs = data
this.curChange(this.cid)
}
}).catch(err => {})
}).catch(err => { })
},
//
curChange(val) {
curChange (val) {
const cid = val[0]
if (val.length === 1) {
//
@ -320,7 +373,7 @@ export default {
this.initData()
},
//
founderChange(val) {
founderChange (val) {
this.$router.push({
path: 'list',
query: {
@ -330,16 +383,16 @@ export default {
})
this.initData()
},
initData() {
initData () {
this.page = 1;
this.getData();
},
disabledSelection(row, index) { //
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) { //
handleCurrentChange (val) { //
this.page = val;
// this.$router.push({
// path: '/project/list',
@ -350,18 +403,18 @@ export default {
// })
this.getData();
},
add() { //
add () { //
this.setSystemId(this.systemId);
this.$router.push(`/project/add?founder=${this.queryData.founder}`);
},
edit(row, show) { //
edit (row, show) { //
this.setSystemId(row.systemId);
this.$router.push(`/project/add?projectId=${row.projectId}&founder=${this.queryData.founder}${show ? `&show=1` : ''}`);
},
handleSelectionChange(val) { //
handleSelectionChange (val) { //
this.multipleSelection = val;
},
delAllData() { //
delAllData () { //
if (this.multipleSelection.length) {
let ids = this.multipleSelection.map(item => {
return item.projectId;
@ -372,7 +425,7 @@ export default {
util.errorMsg("请先选择项目");
}
},
handleDelete(ids) { //
handleDelete (ids) { //
this.$confirm("确定要删除吗?", "提示", {
type: "warning"
}).then(() => {
@ -387,7 +440,7 @@ export default {
this.$message.info("已取消删除");
});
},
switchOff(row) { //
switchOff (row) { //
this.$get(`${this.api.updateIsOpen}?isOpen=${row.ccupationlabOpen}&projectId=${row.projectId}&platformId=${this.queryData.platformId}`).then(res => {
util.successMsg("更新启用状态成功");
this.getData();
@ -395,7 +448,7 @@ export default {
console.log(err);
});
},
projectNameExistis() { //
projectNameExistis () { //
if (this.projectName) {
this.$post(this.api.queryNameIsExist, { projectName: this.projectName }).then(res => {
if (res.status === 200) {
@ -408,7 +461,7 @@ export default {
this.projectNameRepeat = false;
}
},
copyData(projectId) { // id
copyData (projectId) { // id
this.copyVisible = true;
this.$get(`${this.api.getProjectDetail}?projectId=${projectId}`).then(res => {
this.projectName = res.projectManage.projectName;
@ -420,7 +473,7 @@ export default {
console.log(err);
});
},
copySubmit() {
copySubmit () {
if (!this.projectName) {
util.warningMsg("请输入项目名称");
return;
@ -444,7 +497,7 @@ export default {
console.log(err);
});
},
goBack() { //
goBack () { //
this.$router.back();
}
}
@ -452,5 +505,4 @@ export default {
</script>
<style lang="scss" scoped>
</style>

@ -3,21 +3,34 @@
<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 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>
<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="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>
@ -25,9 +38,11 @@
</div>
</template>
</template>
<div class="empty flex-1" v-else>
<div class="empty flex-1"
v-else>
<div>
<img src="@/assets/img/none.png" alt="">
<img src="@/assets/img/none.png"
alt="">
<p>暂无数据</p>
</div>
</div>
@ -40,7 +55,7 @@
<script>
export default {
name: "backstage",
data() {
data () {
return {
keyword: "",
active: 0,
@ -57,29 +72,29 @@ export default {
curriculumList: []
}
},
mounted() {
mounted () {
this.getschoolCourse();
},
methods: {
getschoolCourse() { //
getschoolCourse () { //
this.active ?
this.$post(this.api.recentUse, {
pageNum: 1,
pageSize: 100
}).then(({ page }) => {
this.curriculumList = page.records
}).catch(err => {}) :
}).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 || ''}`);
goPreview (item) {
this.$router.push(`/station/preview?courseId=${item.cid}&curriculumName=${item.curriculumName}&mallId=${item.mallId || ''}&admin=1`);
},
// tab
tabChange(item) {
tabChange (item) {
this.active = item.id
this.getschoolCourse()
},
@ -138,14 +153,14 @@ 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,
background: url(../../../assets/img/station1.png) (top left) / auto no-repeat,
url(../../../assets/img/station2.png) bottom right/auto no-repeat;
.inner {
width: 1072px;
@ -166,7 +181,7 @@ export default {
border-radius: 8px;
cursor: pointer;
&:hover {
opacity: .9;
opacity: 0.9;
}
img {
width: 215px;
@ -197,23 +212,23 @@ 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{
.empty {
display: flex;
justify-content: center;
align-items: center;
padding: 50px 0;
text-align: center;
img{
img {
width: 471px;
}
p{
p {
margin-top: 40px;
font-size: 18px;
color: rgba(0, 0, 0, 0.25);

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save