huoran
/
FE_occupationlab_client
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 14 Wiki Activity

教学互动联调

Browse Source
alioss
yujialong 2 years ago
parent d543dbf308
commit 3dae9d9b85
11 changed files with 882 additions and 665 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      src/api/index.js
  2. BIN
      src/assets/img/like-up.png
  3. BIN
      src/assets/img/like.png
  4. BIN
      src/assets/img/love1.png
  5. BIN
      src/assets/img/love2.png
  6. 12
      src/pages/activity/list/index.vue
  7. 689
      src/pages/activity/manage/list/index.vue
  8. 347
      src/pages/activity/manage/manage/matchSignup.vue
  9. 154
      src/pages/station/preview/index.vue
  10. 2
      src/setting.js
  11. 336
      src/styles/page/station.scss

7
src/api/index.js
Unescape View File

@ -40,6 +40,13 @@ export default {
deleteNotes: `nakadai/curriculumNotes/deleteNotes`,
updateNote: `nakadai/curriculumNotes/updateNote`,
// 教学互动
addComment: `nakadai/comment/addComment`,
commentTreeList: `nakadai/comment/commentTreeList`,
deleteAComment: `nakadai/comment/deleteAComment`,
commentAndLike: `nakadai/commentLike/commentAndLike`,
unlike: `nakadai/commentLike/unlike`,
// 能力测评
canExperiment: `occupationlab/occupationlab/evaluationrecord/can_experiment`, // 查询是否能够开启实验
experimentDetail: `occupationlab/occupationlab/evaluationrecord/detail`, // 成绩详情

BIN
src/assets/img/like-up.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 380 B

BIN
src/assets/img/like.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 408 B

After

Width:  |  Height:  |  Size: 463 B

BIN
src/assets/img/love1.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 436 B

BIN
src/assets/img/love2.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 411 B

12
src/pages/activity/list/index.vue
Unescape View File

@ -63,6 +63,14 @@
<span class="val">{{ item.initiator }}</span>
</div>
</template>
<div class="m-t-20">
<!-- <img src="@/assets/img/love1.png"
alt=""> -->
<img class="m-r-5"
src="@/assets/img/love2.png"
alt="">
2人关注
</div>
</div>
</div>
</div>
@ -145,6 +153,10 @@ export default {
{
id: 0,
name: "已报名"
},
{
id: 1,
name: "已关注项目"
}
],
form: {

689
src/pages/activity/manage/list/index.vue
Unescape View File

@ -1,89 +1,148 @@
<template>
<div class="wrap">
<div class="page">
<h6 class="p-title">筛选</h6>
<div class="tool mul">
<ul class="filter">
<li>
<label>创建时间：</label>
<el-radio-group size="small" v-model="form.month" @change="changeType">
<el-radio v-for="(item,index) in dateList" :key="index" :label="item.id" border>{{ item.name }}</el-radio>
</el-radio-group>
</li>
<li>
<label>创建区间：</label>
<el-date-picker v-model="date" align="right" unlink-panels type="daterange" start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable></el-date-picker>
</li>
<li>
<label>搜索：</label>
<el-input placeholder="请输入项目名称/创建人" suffix-icon="el-icon-search" v-model="keyword" clearable></el-input>
</li>
</ul>
</div>
<div class="tool mul">
<ul class="filter">
<li>
<label>状态：</label>
<dl>
<dd>
<el-radio-group v-model="form.publishStatus" @change="changeType">
<el-radio v-for="(item,index) in statuses" :key="index" :label="item.id" border>{{ item.name }}</el-radio>
</el-radio-group>
</dd>
</dl>
</li>
</ul>
<div>
<el-button type="primary" round @click="add">创建项目</el-button>
<el-button type="primary" round @click="delAllSelection">批量删除</el-button>
</div>
<h6 class="p-title">筛选</h6>
<div class="tool mul">
<ul class="filter">
<li>
<label>创建时间：</label>
<el-radio-group size="small"
v-model="form.month"
@change="changeType">
<el-radio v-for="(item,index) in dateList"
:key="index"
:label="item.id"
border>{{ item.name }}</el-radio>
</el-radio-group>
</li>
<li>
<label>创建区间：</label>
<el-date-picker v-model="date"
align="right"
unlink-panels
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
clearable></el-date-picker>
</li>
<li>
<label>搜索：</label>
<el-input placeholder="请输入项目名称/创建人"
suffix-icon="el-icon-search"
v-model="keyword"
clearable></el-input>
</li>
</ul>
</div>
<div class="tool mul">
<ul class="filter">
<li>
<label>状态：</label>
<dl>
<dd>
<el-radio-group v-model="form.publishStatus"
@change="changeType">
<el-radio v-for="(item,index) in statuses"
:key="index"
:label="item.id"
border>{{ item.name }}</el-radio>
</el-radio-group>
</dd>
</dl>
</li>
</ul>
<div>
<el-button type="primary"
round
@click="add">创建项目</el-button>
<el-button type="primary"
round
@click="delAllSelection">批量删除</el-button>
</div>
</div>
<el-table ref="table" :data="activityData" class="table" stripe header-align="center" @selection-change="handleSelectionChange" row-key="id">
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column>
<el-table-column type="index" width="60" label="序号" align="center">
<template slot-scope="scope">
{{ scope.$index + (page - 1) * pageSize + 1 }}
</template>
</el-table-column>
<el-table-column prop="projectName" label="项目名称" align="center"></el-table-column>
<el-table-column prop="applicantNum" label="报名人数" align="center" width="150"></el-table-column>
<el-table-column prop="status" label="状态" align="center" width="90">
<template slot-scope="scope">
{{ scope.row.publishStatus ? '已发布' : '未发布' }}
</template>
</el-table-column>
<el-table-column prop="time" label="项目时间" align="center" width="300">
<template slot-scope="scope">
{{ scope.row.playStartTime }} ~ {{ scope.row.playEndTime }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" align="center" width="160"></el-table-column>
<el-table-column prop="founderName" label="创建人" align="center" width="130">
<template slot-scope="scope">
{{ scope.row.founderName || '学校超管' }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="170">
<template slot-scope="scope">
<el-button type="text" @click="manage(scope.row)">管理</el-button>
<el-button type="text" @click="delData(scope.row)">删除</el-button>
<el-switch
v-if="scope.row.publishStatus"
v-model="scope.row.isOpen"
:active-value="0"
:inactive-value="1"
style="margin: 0 10px 0 5px"
:active-text="scope.row.isOpen ? '关' : '开'"
@change="switchOff($event,scope.row,scope.$index)"
></el-switch>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" :current-page="page">
</el-pagination>
</div>
<el-table ref="table"
:data="activityData"
class="table"
stripe
header-align="center"
@selection-change="handleSelectionChange"
row-key="id">
<el-table-column type="selection"
width="55"
align="center"
:reserve-selection="true"></el-table-column>
<el-table-column type="index"
width="60"
label="序号"
align="center">
<template slot-scope="scope">
{{ scope.$index + (page - 1) * pageSize + 1 }}
</template>
</el-table-column>
<el-table-column prop="projectName"
label="项目名称"
align="center"></el-table-column>
<el-table-column prop="applicantNum"
label="报名人数"
align="center"
width="150"></el-table-column>
<el-table-column prop="status"
label="状态"
align="center"
width="90">
<template slot-scope="scope">
{{ scope.row.publishStatus ? '已发布' : '未发布' }}
</template>
</el-table-column>
<el-table-column prop="time"
label="项目时间"
align="center"
width="300">
<template slot-scope="scope">
{{ scope.row.playStartTime }} ~ {{ scope.row.playEndTime }}
</template>
</el-table-column>
<el-table-column prop="createTime"
label="创建时间"
align="center"
width="160"></el-table-column>
<el-table-column prop="founderName"
label="创建人"
align="center"
width="130">
<template slot-scope="scope">
{{ scope.row.founderName || '学校超管' }}
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="170">
<template slot-scope="scope">
<el-button type="text"
@click="manage(scope.row)">管理</el-button>
<el-button type="text"
@click="delData(scope.row)">删除</el-button>
<el-switch v-if="scope.row.publishStatus"
v-model="scope.row.isOpen"
:active-value="0"
:inactive-value="1"
style="margin: 0 10px 0 5px"
:active-text="scope.row.isOpen ? '关' : '开'"
@change="switchOff($event,scope.row,scope.$index)"></el-switch>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination background
layout="total, prev, pager, next"
:total="total"
@current-change="handleCurrentChange"
:current-page="page">
</el-pagination>
</div>
</div>
</div>
</template>
@ -94,249 +153,251 @@ import Setting from "@/setting";
import { mapMutations } from "vuex";
import { Loading } from 'element-ui'
export default {
data() {
return {
timer: null,
keyword: "",
activityData: [],
statuses: [
{
id: '',
name: '不限'
},
{
id: 0,
name: '待发布'
},
{
id: 1,
name: '已发布'
}
],
form: {
month: "",
publishStatus: "",
startTime: "",
endTime: "",
},
multipleSelection: [],
dateList: [
{
id: "",
name: "不限"
},
{
id: 1,
name: "近一个月"
},
{
id: 3,
name: "近三个月"
},
{
id: 6,
name: "近六个月"
}
],
date: [],
page: +this.$route.query.page || 1,
pageSize: 10,
total: 0,
transferPublishStatus: [ "未发布", "已发布"],
modifyVisible: false,
curRow: {
playingStages: []
},
timer: null,
redisTimer: null,
pickerOptions: {
shortcuts: [{
text: '此刻',
onClick(picker) {
picker.$emit('pick', new Date(Date.now() + 5000))
}
}]
}
};
},
watch: {
"form.month": function(val) {
if (val) {
let unit = 24 * 60 * 60 * 1000;
this.date = [util.formatDate("yyyy-MM-dd", new Date(new Date().getTime() - unit * 30 * val)), util.formatDate("yyyy-MM-dd", new Date(new Date().getTime() + unit))];
} else {
this.date = [];
}
data () {
return {
timer: null,
keyword: "",
activityData: [],
statuses: [
{
id: '',
name: '不限'
},
{
id: 0,
name: '待发布'
},
date: function(val) {
if (val) {
this.form.startTime = val[0];
this.form.endTime = val[1];
} else {
this.form.startTime = "";
this.form.endTime = "";
}
this.initData();
{
id: 1,
name: '已发布'
}
],
form: {
month: "",
publishStatus: "",
startTime: "",
endTime: "",
},
multipleSelection: [],
dateList: [
{
id: "",
name: "不限"
},
{
id: 1,
name: "近一个月"
},
keyword: function(val) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initData();
}, 500);
{
id: 3,
name: "近三个月"
},
{
id: 6,
name: "近六个月"
}
],
date: [],
page: +this.$route.query.page || 1,
pageSize: 10,
total: 0,
transferPublishStatus: ["未发布", "已发布"],
modifyVisible: false,
curRow: {
playingStages: []
},
timer: null,
redisTimer: null,
pickerOptions: {
shortcuts: [{
text: '此刻',
onClick (picker) {
picker.$emit('pick', new Date(Date.now() + 5000))
}
}]
}
};
},
watch: {
"form.month": function (val) {
if (val) {
let unit = 24 * 60 * 60 * 1000;
this.date = [util.formatDate("yyyy-MM-dd", new Date(new Date().getTime() - unit * 30 * val)), util.formatDate("yyyy-MM-dd", new Date(new Date().getTime() + unit))];
} else {
this.date = [];
}
},
mounted() {
this.getData()
this.$once('hook:beforeDestroy', function() {
clearInterval(this.timer)
clearInterval(this.redisTimer)
})
date: function (val) {
if (val) {
this.form.startTime = val[0];
this.form.endTime = val[1];
} else {
this.form.startTime = "";
this.form.endTime = "";
}
this.initData();
},
methods: {
...mapMutations('activity', [
'setPage'
]),
getList() {
// const load = Loading.service()
const { form } = this
this.$post(this.api.myActivities, {
pageNum: this.page,
pageSize: this.pageSize,
endTime: form.endTime || null,
keyWords: this.keyword || null,
platformSource: 2, // 当前所属平台(0:中台，1：职站教师 2职站学生)
startTime: form.startTime || null,
publishStatus: form.publishStatus === '' ? null : form.publishStatus
}).then(({ data }) => {
// load.close()
if (data) {
const list = data.records
// 定时处理是否要显示修改结束时间按钮
this.timer = setInterval(() => {
const now = new Date()
list.map(e => {
if (!e.playingStages) {
this.$set(e, 'playingStages', [])
} else {
e.playingStages = []
}
// 如果当前时间在项目开始结束时间之间
if (now >= new Date(e.playStartTime) && now <= new Date(e.playEndTime)) {
// 遍历赛事阶段
if (e.competitionStageList) {
for (const n of e.competitionStageList) {
// 判断是否有开始了的阶段
if (now >= new Date(n.startTime) && now <= new Date(n.endTime)) {
e.playingStages.push(n)
}
}
keyword: function (val) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initData();
}, 500);
}
},
mounted () {
this.getData()
this.$once('hook:beforeDestroy', function () {
clearInterval(this.timer)
clearInterval(this.redisTimer)
})
},
methods: {
...mapMutations('activity', [
'setPage'
]),
getList () {
// const load = Loading.service()
const { form } = this
this.$post(this.api.myActivities, {
pageNum: this.page,
pageSize: this.pageSize,
endTime: form.endTime || null,
keyWords: this.keyword || null,
platformSource: 2, // 当前所属平台(0:中台，1：职站教师 2职站学生)
startTime: form.startTime || null,
publishStatus: form.publishStatus === '' ? null : form.publishStatus
}).then(({ data }) => {
// load.close()
if (data) {
const list = data.records
// 定时处理是否要显示修改结束时间按钮
this.timer = setInterval(() => {
const now = new Date()
list.map(e => {
if (!e.playingStages) {
this.$set(e, 'playingStages', [])
} else {
e.playingStages = []
}
// 如果当前时间在项目开始结束时间之间
if (now >= new Date(e.playStartTime) && now <= new Date(e.playEndTime)) {
// 遍历赛事阶段
if (e.competitionStageList) {
for (const n of e.competitionStageList) {
// 判断是否有开始了的阶段
if (now >= new Date(n.startTime) && now <= new Date(n.endTime)) {
e.playingStages.push(n)
}
}
})
}, 1000)
list.map(e => {
if (e.schoolOpen) e.isOpen = 1
})
this.activityData = list
this.total = data.total
this.$refs.table.clearSelection()
if (!this.activityData.length && this.total) {
this.page--
this.getData()
}
}
}
}).catch(res => {
// load.close()
})
},
getData() {
this.getList()
},
initData() {
this.page = 1;
this.getData();
},
// 获取redis缓存
getRedis() {
this.$post(this.api.getRedisCacheActivity).then(({ data }) => {
if (data) {
localStorage.getItem('activityTimestampClient') !== data && this.getList() // 本地缓存跟redis返回的不一样，就查询列表
localStorage.setItem('activityTimestampClient', data)
}
}).catch(res => {})
},
getData() {
this.getList()
// if (!Setting.isDev) {
clearInterval(this.redisTimer)
this.redisTimer = setInterval(this.getRedis, 1000)
// }
},
add() {
this.$router.push("add");
},
manage(row) {
this.$router.push(`manageDetail?id=${row.id}&name=${row.projectName}`)
},
changeType() {
this.$refs.table.clearSelection();
this.initData();
},
delData(row) {
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
type: "warning"
})
.then(() => {
this.$post(this.api.batchDeletionActivity, [row.id]).then(res => {
util.successMsg("删除成功");
this.getData();
}).catch(res => {
});
})
.catch(() => {
});
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
// 批量删除
delAllSelection() {
if (this.multipleSelection.length) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
let ids = this.multipleSelection.map(e => e.id);
this.$post(this.api.batchDeletionActivity, this.multipleSelection.map(e => e.id)).then(res => {
this.getData();
this.$message.success("删除成功");
this.$refs.table.clearSelection()
}).catch(err => {
});
}).catch(() => {
});
} else {
this.$message.warning("请先选择项目 ！");
}
},
handleCurrentChange(val) {
this.page = val;
this.$router.push(`list?page=${val}`)
}, 1000)
list.map(e => {
if (e.schoolOpen) e.isOpen = 1
})
this.activityData = list
this.total = data.total
this.$refs.table.clearSelection()
if (!this.activityData.length && this.total) {
this.page--
this.getData()
this.setPage(val)
},
transferTime(date, type) {
if (date == "0000-00-00 00:00:00") return "---";
return date;
},
switchOff(val, row) {
this.$post(this.api.disabledEventsActivity, {
activityId: row.id,
isOpen: val,
type: 2 // 禁用平台来源(0中台，1职站)
}).then(res => {}).catch(err => {})
},
}
}
}
}).catch(res => {
// load.close()
})
},
getData () {
this.getList()
},
initData () {
this.page = 1;
this.getData();
},
// 获取redis缓存
getRedis () {
this.$post(this.api.getRedisCacheActivity).then(({ data }) => {
if (data) {
localStorage.getItem('activityTimestampClient') !== data && this.getList() // 本地缓存跟redis返回的不一样，就查询列表
localStorage.setItem('activityTimestampClient', data)
}
}).catch(res => { })
},
getData () {
this.getList()
// if (!Setting.isDev) {
clearInterval(this.redisTimer)
this.redisTimer = setInterval(this.getRedis, 1000)
// }
},
add () {
this.$router.push("add");
},
manage (row) {
this.$router.push(`manageDetail?id=${row.id}&name=${row.projectName}`)
},
changeType () {
this.$refs.table.clearSelection();
this.initData();
},
delData (row) {
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
type: "warning"
})
.then(() => {
this.$post(this.api.batchDeletionActivity, [row.id]).then(res => {
util.successMsg("删除成功");
this.getData();
}).catch(res => {
});
})
.catch(() => {
});
},
handleSelectionChange (val) {
this.multipleSelection = val;
},
// 批量删除
delAllSelection () {
if (this.multipleSelection.length) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
let ids = this.multipleSelection.map(e => e.id);
this.$post(this.api.batchDeletionActivity, this.multipleSelection.map(e => e.id)).then(res => {
this.getData();
this.$message.success("删除成功");
this.$refs.table.clearSelection()
}).catch(err => {
});
}).catch(() => {
});
} else {
this.$message.warning("请先选择项目 ！");
}
},
handleCurrentChange (val) {
this.page = val;
this.$router.push(`list?page=${val}`)
this.getData()
this.setPage(val)
},
transferTime (date, type) {
if (date == "0000-00-00 00:00:00") return "---";
return date;
},
switchOff (val, row) {
this.$post(this.api.disabledEventsActivity, {
activityId: row.id,
isOpen: val,
type: 2
}).then(res => { }).catch(err => {
row.isOpen = val ? 0 : 1
})
},
}
};
</script>

347
src/pages/activity/manage/manage/matchSignup.vue
Unescape View File

@ -1,57 +1,93 @@
<template>
<!-- 报名人员 -->
<div class="page-content" style="padding: 24px">
<div class="tool">
<ul class="filter">
<li>
<label>搜索：</label>
<el-input placeholder="请输入姓名/手机号/学号" prefix-icon="el-icon-search" v-model="keyword" clearable size="mini" style="width: 250px"></el-input>
</li>
<li>
<label>报名人员状态：</label>
<el-select v-model="isDisable" @change="initData">
<el-option v-for="(item, i) in statusList" :key="i" :label="item.name" :value="item.id"></el-option>
</el-select>
</li>
</ul>
<div>
<el-button type="primary" round @click="exportAll">批量导出</el-button>
</div>
</div>
<!-- 报名人员 -->
<div class="page-content"
style="padding: 24px">
<div class="tool">
<ul class="filter">
<li>
<label>搜索：</label>
<el-input placeholder="请输入姓名/手机号/学号"
prefix-icon="el-icon-search"
v-model="keyword"
clearable
size="mini"
style="width: 250px"></el-input>
</li>
<li>
<label>报名人员状态：</label>
<el-select v-model="isDisable"
@change="initData">
<el-option v-for="(item, i) in statusList"
:key="i"
:label="item.name"
:value="item.id"></el-option>
</el-select>
</li>
</ul>
<div>
<el-button type="primary"
round
@click="exportAll">批量导出</el-button>
</div>
</div>
<el-table ref="table" :data="listData" class="table" stripe header-align="center" @selection-change="handleSelectionChange" row-key="id">
<el-table-column type="selection" width="80" align="center" :reserve-selection="true"></el-table-column>
<el-table-column type="index" width="60" label="序号" align="center">
<template slot-scope="scope">
{{ scope.$index + (page - 1) * pageSize + 1 }}
</template>
</el-table-column>
<el-table-column prop="schoolName" label="学校" sortable="custom">
</el-table-column>
<el-table-column prop="username" label="学生姓名">
</el-table-column>
<el-table-column prop="workNumber" label="学号">
</el-table-column>
<el-table-column prop="phone" label="手机号">
</el-table-column>
<el-table-column label="操作" align="center" width="320">
<template slot-scope="scope">
<el-switch
v-model="scope.row.isDisable"
:active-text="scope.row.isDisable ? '关' : '开'"
:active-value="0"
:inactive-value="1"
style="margin: 0 10px 0 5px"
@change="switchOff($event,scope.row,scope.$index)"
></el-switch>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" :current-page="page">
</el-pagination>
</div>
<el-table ref="table"
:data="listData"
class="table"
stripe
header-align="center"
@selection-change="handleSelectionChange"
row-key="id"
@sort-change="sortChange">
<el-table-column type="selection"
width="80"
align="center"
:reserve-selection="true"></el-table-column>
<el-table-column type="index"
width="60"
label="序号"
align="center">
<template slot-scope="scope">
{{ scope.$index + (page - 1) * pageSize + 1 }}
</template>
</el-table-column>
<el-table-column prop="schoolName"
label="学校"
sortable="custom">
</el-table-column>
<el-table-column prop="username"
label="学生姓名">
</el-table-column>
<el-table-column prop="workNumber"
label="学号">
</el-table-column>
<el-table-column prop="phone"
label="手机号">
</el-table-column>
<el-table-column label="操作"
align="center"
width="320">
<template slot-scope="scope">
<el-button type="text"
@click="delData(scope.row)">删除</el-button>
<el-switch v-model="scope.row.isDisable"
:active-text="scope.row.isDisable ? '关' : '开'"
:active-value="0"
:inactive-value="1"
style="margin-left: 5px"
@change="switchOff($event,scope.row,scope.$index)"></el-switch>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination background
layout="total, prev, pager, next"
:total="total"
@current-change="handleCurrentChange"
:current-page="page">
</el-pagination>
</div>
</div>
</template>
<script>
@ -59,109 +95,130 @@ import util from "@/libs/util";
import axios from 'axios'
import Setting from "@/setting";
export default {
name: "matchSignup",
data() {
return {
token: util.local.get(Setting.tokenKey),
id: +this.$route.query.id,
isDisable: '',
statusList: [
{
id: '',
name: '不限'
},
{
id: 1,
name: '已禁用'
},
{
id: 0,
name: '未禁用'
}
],
keyword: "",
listData: [],
multipleSelection: [],
page: 1,
pageSize: 10,
total: 0,
};
},
watch: {
keyword: function(val) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initData();
}, 500);
name: "matchSignup",
data () {
return {
token: util.local.get(Setting.tokenKey),
id: +this.$route.query.id,
isDisable: '',
statusList: [
{
id: '',
name: '不限'
},
{
id: 1,
name: '已禁用'
},
{
id: 0,
name: '未禁用'
}
],
keyword: "",
listData: [],
multipleSelection: [],
page: 1,
pageSize: 10,
total: 0,
};
},
watch: {
keyword: function (val) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initData();
}, 500);
}
},
mounted () {
this.initData()
},
methods: {
getData () {
this.$post(this.api.ApplicantsList, {
pageNum: this.page,
pageSize: this.pageSize,
activityId: this.id,
keyWords: this.keyword,
isDisable: this.isDisable,
}).then(({ data }) => {
this.listData = data.data.records;
this.total = data.data.total;
}).catch(res => {
});
},
mounted() {
this.initData()
initData () {
this.page = 1
this.getData()
},
methods: {
getData() {
this.$post(this.api.ApplicantsList, {
pageNum: this.page,
pageSize: this.pageSize,
activityId: this.id,
keyWords: this.keyword,
isDisable: this.isDisable,
}).then(({ data }) => {
this.listData = data.data.records;
this.total = data.data.total;
}).catch(res => {
});
},
initData() {
this.page = 1
this.getData()
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
handleCurrentChange(val) {
this.page = val;
handleSelectionChange (val) {
this.multipleSelection = val;
},
handleCurrentChange (val) {
this.page = val;
this.getData();
},
switchOff (val, row, index) {
this.$put(`${this.api.disableActivityApplicant}?competitionRegistrationId=${row.id}&isDisable=${val}`).then(res => { }).catch(err => { });
},
delData (row) {
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
type: "warning"
})
.then(() => {
this.$post(`${this.api.delActivityApplicant}?id=${row.id}`).then(res => {
util.successMsg("删除成功");
this.getData();
},
switchOff(val, row, index) {
this.$put(`${this.api.disableActivityApplicant}?competitionRegistrationId=${row.id}&isDisable=${val}`).then(res => {}).catch(err => {});
},
exportAll() {
const data = this.multipleSelection
if (data.length) {
data.map((e, i) => e.id = i + 1)
axios.post(this.api.exportDataInBatchesApplicant, data, {
headers: {
token: this.token
},
responseType: 'blob'
}).then((res) => {
util.downloadFileDirect(`报名人员.xls`, new Blob([res.data]))
}).catch(res => {})
} else {
axios.get(`${this.api.excelExportApplicant}?activityId=${this.id}`, {
headers: {
token: this.token
},
responseType: 'blob'
}).then((res) => {
util.downloadFileDirect(`报名人员.xls`, new Blob([res.data]))
}).catch(res => {})
}
}
}).catch(res => {
});
})
.catch(() => {
});
},
// 排序回调
sortChange (column) {
// 1上2下
if (column.prop === 'school') this.schoolOrder = column.order ? column.order === 'ascending' ? 2 : 1 : ''
if (column.prop === 'teamName') this.teamOrder = column.order ? column.order === 'ascending' ? 2 : 1 : ''
this.getData()
},
exportAll () {
const data = this.multipleSelection
if (data.length) {
data.map((e, i) => e.id = i + 1)
axios.post(this.api.exportDataInBatchesApplicant, data, {
headers: {
token: this.token
},
responseType: 'blob'
}).then((res) => {
util.downloadFileDirect(`报名人员.xls`, new Blob([res.data]))
}).catch(res => { })
} else {
axios.get(`${this.api.excelExportApplicant}?activityId=${this.id}`, {
headers: {
token: this.token
},
responseType: 'blob'
}).then((res) => {
util.downloadFileDirect(`报名人员.xls`, new Blob([res.data]))
}).catch(res => { })
}
}
}
};
</script>
<style lang="scss" scoped>
/deep/.dia-form {
.w-100 {
width: 100%;
}
.tips {
display: flex;
justify-content: center;
align-items: center;
}
.w-100 {
width: 100%;
}
.tips {
display: flex;
justify-content: center;
align-items: center;
}
}
</style>

154
src/pages/station/preview/index.vue
Unescape View File

@ -181,6 +181,7 @@
</el-form-item>
</el-form>
<div class="text-right">
<el-button @click="showNoteAdd = false">取消</el-button>
<el-button type="primary"
@click="submitNote">保存</el-button>
</div>
@ -227,11 +228,16 @@
<div class="page">
<quill ref="quill"
:border="true"
v-model="msg"
v-model="comment"
:height="150"
:toTop="false" />
<div class="m-t-10 text-right">
<el-button type="primary"
size="mini"
@click="submitComment(0)">提交</el-button>
</div>
<ul class="msg">
<li v-for="(item, i) in msgs"
<li v-for="(item, i) in comments"
:key="i">
<div class="li-wrap">
<img :src="item.avatar"
@ -239,18 +245,27 @@
class="avatar">
<div class="texts">
<h6>
<span class="name">{{ item.userName }}</span>
发表于 {{ item.createDate }}
<span class="name">{{ item.createUsername }}</span>
发表于 {{ item.createTime }}
</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"
<i class="icon el-icon-chat-dot-square"
@click="showReplay(item)"></i>
<i class="icon el-icon-delete"
@click="delComment(item)"></i>
<img v-if="item.isLike"
class="icon"
src="@/assets/img/like-up.png"
alt=""
@click="like(item)">
<img v-else
class="icon"
src="@/assets/img/like.png"
alt="">
alt=""
@click="like(item)">
</div>
</div>
<div class="reply"
@ -261,7 +276,8 @@
:height="150" />
<div class="m-t-10 text-right">
<el-button type="primary"
size="mini">提交</el-button>
size="mini"
@click="submitComment(item)">提交</el-button>
</div>
</div>
<ul class="msg children"
@ -273,17 +289,26 @@
:src="reply.avatar"
alt="">
<div class="texts">
<div class="name">{{reply.userName}}</div>
<div class="name">{{reply.createUsername}}</div>
<div class="des"
v-html="reply.content"></div>
<div class="date">{{reply.createDate}}</div>
<div class="date">{{reply.createTime}}</div>
</div>
<div class="action">
<i class="icon el-icon-chat-dot-square"></i>
<i class="icon el-icon-delete"></i>
<img class="icon"
<i class="icon el-icon-chat-dot-square"
@click="showReplay(reply)"></i>
<i class="icon el-icon-delete"
@click="delComment(reply)"></i>
<img v-if="reply.isLike"
class="icon"
src="@/assets/img/like-up.png"
alt=""
@click="like(reply)">
<img v-else
class="icon"
src="@/assets/img/like.png"
alt="">
alt=""
@click="like(reply)">
</div>
</div>
<div class="reply"
@ -294,7 +319,8 @@
:height="150" />
<div class="m-t-10 text-right">
<el-button type="primary"
size="mini">提交</el-button>
size="mini"
@click="submitComment(item, reply)">提交</el-button>
</div>
</div>
</li>
@ -437,27 +463,8 @@ export default {
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,
}
]
}
]
comments: [],
comment: '',
};
},
computed: {
@ -478,6 +485,20 @@ export default {
this.getData();
this.addRecord()
this.getNote()
this.getComment()
var arr6 = [1, 2, [3, 4, [5, 6]]];
function flatten (arr) {
var result = [];
for (var i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i])) {
result = result.concat(flatten(arr[i]))
} else {
result.push(arr[i]);
}
}
return result;
}
console.log(11, flatten(arr6))
},
destroyed () {
// 记录播放时长
@ -561,7 +582,6 @@ export default {
// 保存笔记
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 => {
@ -586,6 +606,64 @@ export default {
this.noteForm = JSON.parse(JSON.stringify(row))
this.showNoteAdd = true
},
// 教学互动列表
getComment () {
this.$get(this.api.commentTreeList, {
cid: this.courseId,
}).then(res => {
const list = res.rootComments
this.handleComments(list)
// console.log("🚀 ~ file: index.vue:590 ~ getComment ~ list:", list, l)
this.comments = list
}).catch(res => { })
},
// 递归处理评论参数
handleComments (list) {
list.forEach(e => {
if (!e.avatar) e.avatar = 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
e.getCommentReplyNum = e.children && e.children.length
e.showChildren = false
e.showReply = false
e.replyContent = ''
e.children && this.handleComments(e.children)
})
},
// 回复
showReplay (row) {
row.showReply = !row.showReply
},
// 删除评论
delComment (row) {
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
type: "warning"
}).then(() => {
this.$post(`${this.api.deleteAComment}?commentId=${row.commentId}`).then(res => {
util.successMsg("删除成功");
this.getComment();
}).catch(res => { })
}).catch(() => { })
},
// 保存评论
submitComment (row, reply) {
const content = reply ? reply.replyContent : row ? row.replyContent : this.comment
if (!content) return util.errorMsg('请输入内容！')
this.$post(this.api.addComment, {
cid: this.courseId,
content,
pid: row ? row.commentId : 0
}).then(res => {
this.comment = ''
this.getComment()
}).catch(res => { })
},
// 评论点赞
like (row) {
this.$post(`${this.api[row.isLike ? 'unlike' : 'commentAndLike']}?commentId=${row.commentId}`).then(res => {
row.isLike = row.isLike ? 0 : 1
}).catch(res => { })
},
// 插入阿里云播放器脚本
insertScript () {
const linkTag = document.createElement("link");

2
src/setting.js
Unescape View File

@ -29,7 +29,7 @@ if (isPro) {
host = "http://121.37.12.51/"; // 测试服
// host = 'https://www.occupationlab.com/' // 正式服
// host = "http://192.168.31.151:9000/"; // 榕
// host = "http://192.168.31.116:9000/"; // 赓
host = "http://192.168.31.53:9000/"; // 赓
}
const Setting = {

336
src/styles/page/station.scss
Unescape View File

@ -1,173 +1,175 @@
.msg{
li{
margin-bottom: 10px;
border-top: 1px solid #f1f1f1;
&:first-child{
border-top: 0;
}
.li-wrap{
position: relative;
display: flex;
justify-content: space-between;
padding: 16px 0;
.avatar{
width: 48px;
height: 48px;
border-radius: 50%;
}
.texts{
flex: 1;
margin-left: 24px;
.name{
color: rgba(0, 0, 0, 0.85);
font-size: 16px;
}
.des{
margin: 8px 0;
}
.date{
color: rgba(0, 0, 0, 0.45);
font-size: 14px;
}
}
.action{
display: inline-flex;
align-items: center;
margin-top: 15px;
.icon{
margin: 0 5px;
color: $main-color;
font-size: 18px;
cursor: pointer;
&:hover{
opacity: .8;
}
&:first-child{
margin-right: 5px;
}
&.del{
color: rgba(0, 0, 0, 0.65);
border: 1px solid rgba(0, 0, 0, 0.15);
}
}
}
}
.reply{
margin-top: 20px;
}
}
&.children{
margin-left: 72px;
padding-left: 24px;
background-color: rgba(0, 0, 0, 0.02);
border-radius: 8px;
li{
border-top-color: rgba(0, 0, 0, 0.06);
}
}
.msg {
li {
margin-bottom: 10px;
border-top: 1px solid #f1f1f1;
&:first-child {
border-top: 0;
}
.li-wrap {
position: relative;
display: flex;
justify-content: space-between;
padding: 16px 0;
.avatar {
width: 48px;
height: 48px;
border-radius: 50%;
}
.texts {
flex: 1;
margin-left: 24px;
.name {
color: rgba(0, 0, 0, 0.85);
font-size: 16px;
}
.des {
margin: 8px 0;
}
.date {
color: rgba(0, 0, 0, 0.45);
font-size: 14px;
}
}
.action {
display: inline-flex;
align-items: center;
margin-top: 15px;
.icon {
margin: 0 5px;
color: $main-color;
font-size: 18px;
cursor: pointer;
&:hover {
opacity: 0.8;
}
&:first-child {
margin-right: 5px;
}
&.del {
color: rgba(0, 0, 0, 0.65);
border: 1px solid rgba(0, 0, 0, 0.15);
}
}
}
}
.reply {
padding-bottom: 10px;
margin-top: 20px;
}
}
&.children {
margin-left: 72px;
padding-left: 24px;
background-color: rgba(0, 0, 0, 0.02);
border-radius: 8px;
li {
border-top-color: rgba(0, 0, 0, 0.06);
}
}
}
.toggle{
margin: 16px 0;
text-align: center;
color: $main-color;
font-size: 14px;
span{
cursor: pointer;
}
.toggle {
margin: 16px 0;
text-align: center;
color: $main-color;
font-size: 14px;
span {
cursor: pointer;
}
}
/deep/.quill{
background-color: #fff;
/deep/.quill {
background-color: #fff;
}
/deep/.timeline {
padding-left: 10%;
overflow: hidden;
.el-timeline-item {
padding-bottom: 40px;
}
.el-timeline-item__node--normal {
top: 30px;
}
.el-timeline-item__wrapper {
top: 15px;
padding-left: 40px;
}
.el-timeline-item__tail {
height: 250%;
border-left-width: 1px;
}
.sign {
position: relative;
display: inline-block;
margin-left: -14%;
font-size: 14px;
color: #9076FF;
}
.draft {
.ver, .sign {
color: #b1b1b1;
}
}
.ver {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 10px;
margin: -22px 0 20px;
font-size: 18px;
color: #9076FF;
border-bottom: 1px dashed #bfbfbf;
}
.withdraw {
margin-right: 10px;
font-size: 13px;
color: #979797;
}
.action {
margin-left: 15px;
i {
margin-left: 8px;
font-size: 14px;
color: #9076FF;
cursor: pointer;
&:hover {
opacity: .9;
}
}
}
.detail {
li {
margin-bottom: 20px;
}
.name {
display: flex;
align-items: center;
margin-bottom: 5px;
font-size: 15px;
font-weight: 600;
img {
width: 20px;
margin-right: 5px;
}
}
.val {
font-size: 14px;
line-height: 1.8;
white-space: pre-wrap;
p {
position: relative;
color: #6a6a6a;
&:before {
content: '';
display: inline-block;
width: 5px;
height: 5px;
margin: 0 10px 0 5px;
vertical-align: middle;
border-radius: 20px;
background-color: #c5b8ff;
padding-left: 10%;
overflow: hidden;
.el-timeline-item {
padding-bottom: 40px;
}
.el-timeline-item__node--normal {
top: 30px;
}
.el-timeline-item__wrapper {
top: 15px;
padding-left: 40px;
}
.el-timeline-item__tail {
height: 250%;
border-left-width: 1px;
}
.sign {
position: relative;
display: inline-block;
margin-left: -14%;
font-size: 14px;
color: #007eff;
}
.draft {
.ver,
.sign {
color: #b1b1b1;
}
}
.ver {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 10px;
margin: -22px 0 20px;
font-size: 18px;
color: #007eff;
border-bottom: 1px dashed #bfbfbf;
}
.withdraw {
margin-right: 10px;
font-size: 13px;
color: #979797;
}
.action {
margin-left: 15px;
i {
margin-left: 8px;
font-size: 14px;
color: #007eff;
cursor: pointer;
&:hover {
opacity: 0.9;
}
}
}
.detail {
li {
margin-bottom: 20px;
}
.name {
display: flex;
align-items: center;
margin-bottom: 5px;
font-size: 15px;
font-weight: 600;
img {
width: 20px;
margin-right: 5px;
}
}
}
}
}
}
.val {
font-size: 14px;
line-height: 1.8;
white-space: pre-wrap;
p {
position: relative;
color: #6a6a6a;
&:before {
content: '';
display: inline-block;
width: 5px;
height: 5px;
margin: 0 10px 0 5px;
vertical-align: middle;
border-radius: 20px;
background-color: #c5b8ff;
}
}
}
}
}

Write Preview
Loading…
Cancel
Save