Skip to content

P
pica.cloud.web-education-admin
提交 125cb151 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

项目整理等

上级 95c7ec2e
隐藏空白字符变更
内嵌 并排
正在显示 包含 0 行增加 和 18860 行删除
src/components/education/custom/course-select copy 2.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="custom-select-wrapper" style="width: 1300px;overflow:auto;">
<div class="department-label">
<span
v-for="(item, index) in allLabelList"
:key="index"
class="item"
:class="{checked: item.checked}"
@click="selectLabel(index)"
>
<span class="split" :class="{acitve: item.checked}"></span>
{{item.name}}
</span>
</div>
<!-- 课程分类 -->
<div class="course-class">
<div class="title">课程分类</div>
<div class="item" @click="selectSubLabel(subLabelList[0])">
<span class="name" :class="{'active': subLabelList[0].checked}">全部</span>
</div>
<ul class="check-list">
<!-- <el-checkbox-group v-model="checkList" @change="handleClassChange">
<el-checkbox
v-for="(item, index) in subLabelList.slice(1)"
:label="item.id"
:key="index"
@change="selectSubLabel(item)"
>{{item.name}}</el-checkbox>
</el-checkbox-group> -->
<li
class="sub-item"
:class="{'active': item.checked}"
v-for="(item, index) in subLabelList.slice(1)"
:key="index"
@click="selectSubLabel(item)"
>
<img v-show="item.checked" src="../../../assets/custom/icon/label-sel.png" alt />
<img v-show="!item.checked" src="../../../assets/custom/icon/label-sel-no.png" alt />
{{item.name}}
</li>
</ul>
<!-- <el-checkbox-group v-model="checkList">
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
</el-checkbox-group>-->
<div class="right"></div>
</div>
<!-- 课程等级 -->
<div class="course-level">
<span class="title">课程等级</span>
<span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
>
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<div class="button-wrapper">
<el-button class="add-button" plain size="small">重 置</el-button>
<el-button class="add-button" size="small" type="primary">查 询</el-button>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
data() {
return {
courseLevel: [
{ name: "全部", value: 0, checked: true },
{ name: "初级", value: 1, checked: false },
{ name: "中级", value: 2, checked: false },
{ name: "高级", value: 3, checked: false }
],
checkList: [431, 441]
};
},
props: {
dataList: {
type: Array,
default: () => {
return [
{
name: "全部",
checked: true
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
}
];
}
}
},
computed: {
...mapGetters(['allLabelList', 'subLabelList'])
},
components: {},
methods: {
...mapActions(['setSubLabelList']),
selectLabel(index) {
this.allLabelList.forEach(element => {
element.checked = false;
});
this.allLabelList[index].checked = true;
let subLabelList = this.allLabelList[index].subList;
this.setSubLabelList(subLabelList);
},
// 选择二级
selectSubLabel(item) {
console.log(item);
item.checked = !item.checked;
this.$forceUpdate();
},
selectLevel(index) {
this.courseLevel.forEach(element => {
element.checked = false;
});
this.courseLevel[index].checked = true;
},
handleClassChange() {
// let checkedCount = value.length;
// this.checkAll = checkedCount === this.cities.length;
// this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
}
}
};
</script>
<style lang="less" scoped>
.custom-select-wrapper {
.department-label {
display: flex;
flex-direction: row;
height: 48px;
line-height: 48px;
border-bottom: 2px solid #449284;
border-radius: 6px 6px 0px 0px;
.item {
cursor: pointer;
position: relative;
z-index: 1;
display: inline-block;
padding: 0 22px;
font-size: 16px;
color: #666666;
&.checked {
color: #fff;
z-index: 3;
background: #449284;
}
&:first-child {
border-radius: 6px 0px 0px 0px;
}
}
.split {
position: absolute;
top: 14px;
left: 0px;
z-index: 2;
display: inline-block;
height: 20px;
width: 1px;
background: #c7c8c9;
}
.item:nth-child(1) > .split,
.item.checked + .item > .split,
.split.acitve {
display: none;
}
}
}
.course-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #e4e7ed;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
&.active {
color: #fff;
background: #449284;
}
}
}
}
.course-class {
display: flex;
flex-direction: row;
box-sizing: content-box;
padding: 10px 0;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dashed #e4e7ed;
.title {
height: 56px;
line-height: 56px;
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
height: 56px;
line-height: 56px;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
margin-right: 16px;
&.active {
color: #fff;
background: #449284;
}
}
}
.check-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 14px;
margin-right: 80px;
flex: 1;
.sub-item {
cursor: pointer;
display: flex;
flex-direction: row;
align-items: center;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #333333;
margin-right: 30px;
img {
width: 16px;
height: 16px;
margin-right: 5px;
}
&.active {
color: #449284;
}
}
}
.el-checkbox {
height: 30px;
line-height: 30px;
}
}
.button-wrapper {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 20px;
margin-right: 50px;
}
</style>
\ No newline at end of file
src/components/education/custom/course-select copy 3.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="custom-select-wrapper" style="width: 1300px;overflow:auto;">
<div class="department-label">
<span
v-for="(item, index) in allLabelList"
:key="index"
class="item"
:class="{checked: item.checked}"
@click="selectLabel(index)"
>
<span class="split" :class="{acitve: item.checked}"></span>
{{item.name}}
</span>
</div>
<!-- 课程分类 -->
<div class="course-class">
<div class="title">课程分类</div>
<div class="item" @click="selectSubLabel(subLabelList[0], 1)">
<span class="name" :class="{'active': subLabelList[0].checked}">全部</span>
</div>
<ul class="check-list">
<!-- <el-checkbox-group v-model="checkList" @change="handleClassChange">
<el-checkbox
v-for="(item, index) in subLabelList.slice(1)"
:label="item.id"
:key="index"
@change="selectSubLabel(item)"
>{{item.name}}</el-checkbox>
</el-checkbox-group> -->
<li
class="sub-item"
:class="{'active': item.checked}"
v-for="(item, index) in subLabelList.slice(1)"
:key="index"
@click="selectSubLabel(item, 2)"
>
<img v-show="item.checked" src="../../../assets/custom/icon/label-sel.png" alt />
<img v-show="!item.checked" src="../../../assets/custom/icon/label-sel-no.png" alt />
{{item.name}}
</li>
</ul>
<!-- <el-checkbox-group v-model="checkList">
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
</el-checkbox-group>-->
<div class="right"></div>
</div>
<!-- 课程等级 -->
<div class="course-level">
<span class="title">课程等级</span>
<span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
>
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<div class="button-wrapper">
<el-button class="add-button" plain size="small" @click="resetCond">重 置</el-button>
<el-button class="add-button" size="small" type="primary" @click="search">查 询</el-button>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
data() {
return {
courseLevel: [
{ name: "全部", value: 0, checked: true },
{ name: "初级", value: 1, checked: false },
{ name: "中级", value: 2, checked: false },
{ name: "高级", value: 3, checked: false }
],
checkList: [431, 441]
};
},
props: {
dataList: {
type: Array,
default: () => {
return [
{
name: "全部",
checked: true
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
}
];
}
}
},
computed: {
...mapGetters(['searchParam', 'allLabelList', 'subLabelList'])
},
components: {},
methods: {
...mapActions(['setSubLabelList', 'setSearchParam']),
selectLabel(index) {
this.allLabelList.forEach(element => {
element.checked = false;
});
this.allLabelList[index].checked = true;
let subLabelList = this.allLabelList[index].subList;
this.setSubLabelList(subLabelList);
},
// 选择二级
selectSubLabel(item, type) {
item.checked = !item.checked;
console.log('selectSubLabel', item);
// 如果是没有选中，则直接退出
if(!item.checked) return;
// 是全部按钮 第一个全部：parentid-0
if(type == 1) {
let labelArr = item.id.split('-'), labelType = labelArr[0], labelIndex = labelArr[1] - 0;
labelArr = item.id.split('-');
if(labelType == 'parentid') {
// 将所有子项目清空
this.allLabelList[0].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = false;
}
})
// 将其它所有全部置为不选中
this.allLabelList.forEach( (item, index) => {
index != 0 && (item.subList[0].checked = false);
})
} else {
this.allLabelList[labelIndex + 1].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = false;
}
})
this.allLabelList[0].subList[0].checked = false;
}
// 各个小label
} else if(type == 2) {
let parentIndex = item.parentIndex;
this.allLabelList[0].subList[0].checked = false;
this.allLabelList[parentIndex + 1].subList[0].checked = false;
//
}
this.$forceUpdate();
},
selectLevel(index) {
this.courseLevel.forEach(element => {
element.checked = false;
});
this.courseLevel[index].checked = true;
},
handleClassChange() {
// let checkedCount = value.length;
// this.checkAll = checkedCount === this.cities.length;
// this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
},
resetCond() {
this.allLabelList.forEach((item, index) => {
item.checked = false;
item.subList.forEach((sub, subIndex) => {
sub.checked = false;
});
});
this.setSubLabelList(this.allLabelList[0].subList);
this.allLabelList[0].checked = true;
this.selectLevel(0);
},
search() {
let allSelectedLabel = [];
this.allLabelList.forEach( item => {
// 如果是分类中的全部被选中，则其下所有将添加到查询列表中
if(item.subList[0].checked) {
item.subList.forEach( (sub, index) => {
if(index != 0) {
allSelectedLabel.push(sub.id);
}
})
// 否则只要被选中的
} else {
item.subList.forEach( (sub, index) => {
if(index != 0 && sub.checked) {
allSelectedLabel.push(sub.id);
}
})
}
});
this.searchParam.labelIdList = allSelectedLabel;
// this.searchParam.grade = allSelectedLabel;
this.courseLevel.forEach( item => {
if(item.checked) {
this.searchParam.grade = item.value;
}
})
this.setSearchParam(this.searchParam);
console.log(allSelectedLabel);
}
}
};
</script>
<style lang="less" scoped>
.custom-select-wrapper {
user-select: none;
.department-label {
display: flex;
flex-direction: row;
height: 48px;
line-height: 48px;
border-bottom: 2px solid #449284;
border-radius: 6px 6px 0px 0px;
.item {
cursor: pointer;
position: relative;
z-index: 1;
display: inline-block;
padding: 0 22px;
font-size: 16px;
color: #666666;
&.checked {
color: #fff;
z-index: 3;
background: #449284;
}
&:first-child {
border-radius: 6px 0px 0px 0px;
}
}
.split {
position: absolute;
top: 14px;
left: 0px;
z-index: 2;
display: inline-block;
height: 20px;
width: 1px;
background: #c7c8c9;
}
.item:nth-child(1) > .split,
.item.checked + .item > .split,
.split.acitve {
display: none;
}
}
}
.course-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #e4e7ed;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
&.active {
color: #fff;
background: #449284;
}
}
}
}
.course-class {
display: flex;
flex-direction: row;
box-sizing: content-box;
padding: 10px 0;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dashed #e4e7ed;
.title {
height: 56px;
line-height: 56px;
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
height: 56px;
line-height: 56px;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
margin-right: 16px;
&.active {
color: #fff;
background: #449284;
}
}
}
.check-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 14px;
margin-right: 80px;
flex: 1;
.sub-item {
cursor: pointer;
display: flex;
flex-direction: row;
align-items: center;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #333333;
margin-right: 30px;
img {
width: 16px;
height: 16px;
margin-right: 5px;
}
&.active {
color: #449284;
}
}
}
.el-checkbox {
height: 30px;
line-height: 30px;
}
}
.button-wrapper {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 20px;
margin-right: 50px;
}
</style>
\ No newline at end of file
src/components/education/custom/course-select copy 4.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="custom-select-wrapper" style="width: 1000px;overflow:auto;">
<div class="department-label">
<span
v-for="(item, index) in allLabelList"
:key="index"
class="item"
:class="{checked: item.checked}"
@click="selectLabel(index)"
>
<span class="split" :class="{acitve: item.checked}"></span>
{{item.name}}
</span>
</div>
<!-- 课程分类 -->
<div class="course-class">
<div class="title">课程分类</div>
<div v-if="subLabelList.length" class="item" @click="selectSubLabel(subLabelList[0], 1)">
<span class="name" :class="{'active': subLabelList[0].checked}">全部</span>
</div>
<ul class="check-list">
<li
class="sub-item"
:class="{'active': item.checked}"
v-for="(item, index) in subLabelList.slice(1)"
:key="index"
@click="selectSubLabel(item, 2)"
>
<img v-show="item.checked" src="../../../assets/custom/icon/label-sel.png" alt />
<img v-show="!item.checked" src="../../../assets/custom/icon/label-sel-no.png" alt />
{{item.name}}
</li>
</ul>
<div class="right"></div>
</div>
<!-- 课程等级 -->
<div class="course-level">
<span class="title">课程等级</span>
<span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
>
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<div class="button-wrapper">
<el-button class="add-button" plain size="small" @click="resetCond">重 置</el-button>
<el-button class="add-button" size="small" type="primary" @click="search">查 询</el-button>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
data() {
return {
courseLevel: [
{ name: "全部", value: 0, checked: true },
{ name: "初级", value: 1, checked: false },
{ name: "中级", value: 2, checked: false },
{ name: "高级", value: 3, checked: false }
],
checkList: [431, 441]
};
},
props: {
dataList: {
type: Array,
default: () => {
return [
{
name: "全部",
checked: true
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
}
];
}
}
},
computed: {
...mapGetters(['searchParam', 'allLabelList', 'subLabelList'])
},
components: {},
methods: {
...mapActions(['setSubLabelList', 'setSearchParam']),
// 选择一级
selectLabel(index) {
this.allLabelList.forEach(element => {
element.checked = false;
});
this.allLabelList[index].checked = true;
let subLabelList = this.allLabelList[index].subList;
this.setSubLabelList(subLabelList);
},
// 选择二级
selectSubLabel(item, type) {
item.checked = !item.checked;
console.log('selectSubLabel', item);
// 如果被选中
if(item.checked) {
// 是全部按钮 第一个全部：parentid-0
if(type == 1) {
let labelArr = item.id.split('-'), labelType = labelArr[0], labelIndex = labelArr[1] - 0;
labelArr = item.id.split('-');
if(labelType == 'parentid') {
// 将所有子项目选中
this.allLabelList[0].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = true;
}
})
// 将其它所有全部置为选中
this.allLabelList.forEach( (item, index) => {
index != 0 && (item.subList[0].checked = true);
})
} else {
this.allLabelList[labelIndex + 1].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = true;
}
})
}
}
// 末被选中
} else {
// 是全部按钮 第一个全部：parentid-0
if(type == 1) {
let labelArr = item.id.split('-'), labelType = labelArr[0], labelIndex = labelArr[1] - 0;
labelArr = item.id.split('-');
if(labelType == 'parentid') {
// 将所有子项目选中
this.allLabelList[0].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = false;
}
})
// 将其它所有全部置为选中
this.allLabelList.forEach( (item, index) => {
index != 0 && (item.subList[0].checked = false);
})
} else {
this.allLabelList[labelIndex + 1].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = false;
}
})
}
}
}
// 无论哪种操作，都要重置各个“全部”按钮
this.allLabelList.forEach( (parent, index) => {
let needhecked = true, subList = parent.subList;
for(let i = 1; i < subList.length; i ++) {
if(!subList[i].checked) {
needhecked = false;
break;
}
}
this.allLabelList[index].subList[0].checked = needhecked;
})
this.$forceUpdate();
},
// 选中等级
selectLevel(index) {
this.courseLevel.forEach(element => {
element.checked = false;
});
this.courseLevel[index].checked = true;
},
// 重置按钮
resetCond() {
this.allLabelList.forEach((item, index) => {
item.checked = false;
item.subList.forEach((sub, subIndex) => {
sub.checked = false;
});
});
this.setSubLabelList(this.allLabelList[0].subList);
this.allLabelList[0].checked = true;
this.selectLevel(0);
},
search() {
let allSelectedLabel = [];
this.allLabelList[0].subList.forEach( (item, index) => {
index && item.checked && allSelectedLabel.push(item.id);
})
this.searchParam.labelIdList = allSelectedLabel;
this.courseLevel.forEach( item => {
if(item.checked) {
this.searchParam.grade = item.value;
}
})
this.searchParam.pageNo = 1;
this.setSearchParam(this.searchParam);
console.log(allSelectedLabel);
}
}
};
</script>
<style lang="less" scoped>
.custom-select-wrapper {
user-select: none;
.department-label {
display: flex;
flex-direction: row;
height: 48px;
line-height: 48px;
border-bottom: 2px solid #449284;
border-radius: 6px 6px 0px 0px;
.item {
cursor: pointer;
position: relative;
z-index: 1;
display: inline-block;
padding: 0 22px;
font-size: 16px;
color: #666666;
&.checked {
color: #fff;
z-index: 3;
background: #449284;
}
&:first-child {
border-radius: 6px 0px 0px 0px;
}
}
.split {
position: absolute;
top: 14px;
left: 0px;
z-index: 2;
display: inline-block;
height: 20px;
width: 1px;
background: #c7c8c9;
}
.item:nth-child(1) > .split,
.item.checked + .item > .split,
.split.acitve {
display: none;
}
}
}
.course-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #e4e7ed;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
&.active {
color: #fff;
background: #449284;
}
}
}
}
.course-class {
display: flex;
flex-direction: row;
box-sizing: content-box;
padding: 10px 0;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dashed #e4e7ed;
.title {
height: 56px;
line-height: 56px;
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
height: 56px;
line-height: 56px;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
margin-right: 16px;
&.active {
color: #fff;
background: #449284;
}
}
}
.check-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 14px;
margin-right: 80px;
flex: 1;
.sub-item {
cursor: pointer;
display: flex;
flex-direction: row;
align-items: center;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #333333;
margin-right: 30px;
img {
width: 16px;
height: 16px;
margin-right: 5px;
}
&.active {
color: #449284;
}
}
}
.el-checkbox {
height: 30px;
line-height: 30px;
}
}
.button-wrapper {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 20px;
margin-right: 140px;
}
</style>
\ No newline at end of file
src/components/education/custom/course-select copy.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="custom-select-wrapper">
<div class="department-label">
<span
v-for="(item, index) in allLabelList"
:key="index"
class="item"
:class="{checked: item.checked}"
@click="selectLabel(index)"
>
<span class="split" :class="{acitve: item.checked}"></span>
{{item.name}}
</span>
</div>
<!-- 课程分类 -->
<div class="course-class">
<div class="title">课程分类</div>
<div class="item">
<span class="name active">全部</span>
</div>
<div class="check-list">
<el-checkbox-group v-model="checkList" @change="handleClassChange">
<el-checkbox
v-for="(item, index) in subLabelList"
:label="item.id"
:key="index"
>{{item.name}}</el-checkbox>
</el-checkbox-group>
<!-- <el-checkbox-group v-model="checkList">
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
</el-checkbox-group>-->
</div>
<div class="right"></div>
</div>
<!-- 课程等级 -->
<div class="course-level">
<span class="title">课程等级</span>
<span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
>
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<div class="button-wrapper">
<el-button class="add-button" size="small" type="primary">查 询</el-button>
<el-button class="add-button" plain size="small">重 置</el-button>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
data() {
return {
courseLevel: [
{ name: "全部", value: 0, checked: true },
{ name: "初级", value: 1, checked: false },
{ name: "中级", value: 2, checked: false },
{ name: "高级", value: 3, checked: false }
],
checkList: [431, 441]
};
},
props: {
dataList: {
type: Array,
default: () => {
return [
{
name: "全部",
checked: true
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
}
];
}
}
},
computed: {
...mapGetters(['allLabelList', 'subLabelList'])
},
components: {},
methods: {
...mapActions(['setSubLabelList']),
selectLabel(index) {
this.allLabelList.forEach(element => {
element.checked = false;
});
this.allLabelList[index].checked = true;
let subLabelList = this.allLabelList[index].subList;
this.setSubLabelList(subLabelList);
},
selectLevel(index) {
this.courseLevel.forEach(element => {
element.checked = false;
});
this.courseLevel[index].checked = true;
},
handleClassChange() {
// let checkedCount = value.length;
// this.checkAll = checkedCount === this.cities.length;
// this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
}
}
};
</script>
<style lang="less" scoped>
.custom-select-wrapper {
.department-label {
display: flex;
flex-direction: row;
height: 48px;
line-height: 48px;
border-bottom: 2px solid #449284;
border-radius: 6px 6px 0px 0px;
.item {
cursor: pointer;
position: relative;
z-index: 1;
display: inline-block;
padding: 0 22px;
font-size: 16px;
color: #666666;
&.checked {
color: #fff;
z-index: 3;
background: #449284;
}
&:first-child {
border-radius: 6px 0px 0px 0px;
}
}
.split {
position: absolute;
top: 14px;
left: 0px;
z-index: 2;
display: inline-block;
height: 20px;
width: 1px;
background: #c7c8c9;
}
.item:nth-child(1) > .split,
.item.checked + .item > .split,
.split.acitve {
display: none;
}
}
}
.course-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #e4e7ed;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
&.active {
color: #fff;
background: #449284;
}
}
}
}
.course-class {
display: flex;
flex-direction: row;
box-sizing: content-box;
padding: 10px 0;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dashed #e4e7ed;
.title {
height: 56px;
line-height: 56px;
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
height: 56px;
line-height: 56px;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
margin-right: 16px;
&.active {
color: #fff;
background: #449284;
}
}
}
.check-list {
margin-top: 14px;
margin-right: 80px;
flex: 1;
}
.el-checkbox {
height: 30px;
line-height: 30px;
}
}
.button-wrapper {
margin-top: 20px;
margin-right: 50px;
// height: 60px;
// line-height: 60px;
.add-button {
float: right;
margin: 0 10px;
}
}
</style>
\ No newline at end of file
src/components/education/custom/custom-baseinfo 0526-0910.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<!--基础信息-->
<template>
<div class="base-message-wrap">
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
class="basic-form"
>
<el-form-item label="项目名称：" prop="projectName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.projectName"
placeholder="请输入项目名称"
style="width:70%;"
ref="projectName"
maxlength="24"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectName).replace(/\s+/g,"").length}}/24</span>
</el-col>
<el-col :span="10" class="curt-position-wrapper">
<div class="curt-position">
<ShoppingCart ></ShoppingCart>
</div>
</el-col>
</el-form-item>
<el-form-item label="发起机构名称：">
<el-col :span="13" v-for="(item, index) in formData.organizationNameList" :key="index">
<el-input
size="small"
v-model="formData.organizationNameList[index]"
placeholder="请输入发起机构名称"
style="width:70%;"
maxlength=16
@input="changeOrganizationName"
@blur = "blurName"
@focus = "focusName(index)"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.organizationNameList[index]).replace(/\s+/g,"").length}}/16</span>
<img @click="plusOrg(index)" class="edit-img" src="../../../assets/image/plus.png" v-if="isPreview!=1"/>
<img @click="deleteOrg(index)" v-if="index >= 1 && isPreview!=1" class="edit-img" src="../../../assets/image/trash.png" />
</el-col>
<el-popover
v-if="formData.creatorOrganizationName"
class="popover-content" :style="{'top': orgListIndex * 41 + 'px'}"
placement="bottom"
:content="organizationContent"
v-model="visibleName"
@click="checkDefault">
<p @click="checkDefault"> 我的机构： {{ formData.creatorOrganizationName }} </p>
</el-popover>
</el-form-item>
<div>
<el-form-item label="项目时间：" required>
<el-col :span="5">
<el-form-item prop="projectBegintime">
<el-date-picker
v-model="formData.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions0"
style="width: 100%;"
:disabled="formData.status4Flag == 1 || isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="1">~</el-col>
<el-col :span="5">
<el-form-item label prop="projectEndtime">
<el-date-picker
v-model="formData.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="00:00:00"
style="width: 100%;"
:disabled="isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<p class="time-message"><i class="el-icon-warning-outline"></i>项目有效期为{{formData.expireDay}}天,选择项目起止时间须在有效期内</p>
</div>
<el-form-item label="列表图片：" style="margin-bottom: 10px">
<el-col :span="13" style="height:95px">
<div class="url1-selected">
<img :src="formData.attachmentUrl1" alt="">
</div>
</el-col>
<el-col :span="13" style="height:95px">
<div style="color:#666666;font-size:14px;">从模版中选择其他列表图片</div>
<ul class="url1-list">
<li
class="img-wrapper"
v-for="(item, index) in attachMap[1]"
:key="index"
@click="selectedAttachUrl(item, 1)"
>
<img class="selected-icon" :src="item.attachmentUrl" alt="">
<img class="status-icon" v-show="item.checked" src="../../../assets/custom/icon/icon-select.png" alt />
<img class="status-icon" v-show="!item.checked" src="../../../assets/custom/icon/icon-select-no.png" alt />
</li>
</ul>
</el-col>
</el-form-item>
<!-- <div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="列表图片：">
<el-upload
v-model="formData.attachmentUrl1"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
disabled
>
<img v-if="formData.attachmentUrl1" @mouseover.stop="imgMouseOver=true" :src="formData.attachmentUrl1" class="bg-img">
<img
v-if="!formData.attachmentUrl1"
class="bg-img"
src="../../../assets/image/small.png"
>
<div class="img-delete" v-show="imgMouseOver && false" @click.stop="deleteImg(1)" @mouseout.stop="imgMouseOver=false"><i class="el-icon-delete"></i></div>
<div class="limit-text">
<p>尺寸:230*172</p>
<p>限制大小: 500Kb</p>
<p>支持.jpg,.png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage">请选择列表图片</p>
</div> -->
<!-- @change="changeCover" -->
<el-form-item label="封面类型：">
<el-radio-group
size="small"
v-model="formData.type"
disabled
>
<el-radio :label="1">图片</el-radio>
<!-- <el-radio :label="2">视频</el-radio> -->
</el-radio-group>
</el-form-item>
<!-- <div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="封面文件：">
<el-upload
v-model="formData.attachmentUrl2"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadCoverPic"
disabled
>
<img
v-if="formData.type == 1 && formData.attachmentUrl2"
:src="formData.attachmentUrl2"
@mouseover.stop="imgMouseOver2=true"
class="bg-img"
>
<video
v-if="formData.type == 2 && formData.attachmentUrl2"
width="100"
controls
class="bg-video"
@mouseover.stop="imgMouseOver2=true"
>
<source :src="formData.attachmentUrl2" type="video/mp4">浏览器不支持mp4
</video>
<img
v-if="!formData.attachmentUrl2"
class="bg-img"
src="../../../assets/image/small.png"
>
<div class="img-delete" v-show="imgMouseOver2 && false" @click.stop="deleteImg(2)" @mouseout.stop="imgMouseOver2=false"><i class="el-icon-delete"></i></div>
<div v-show="formData.type == 1" class="limit-text">
<p>尺寸:750*420</p>
<p>限制大小: 2.0 Mb</p>
<p>支持.jpg,.png格式</p>
</div>
<div v-show="formData.type == 2" class="limit-text">
<p></p>
<p>限制大小: 500 Mb</p>
<p>支持.mp4</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage2">请选择封面</p>
</div> -->
<el-form-item label="封面文件：" style="margin-bottom: 10px">
<el-col :span="13" style="height: 95px">
<div class="url2-selected">
<img :src="formData.attachmentUrl2" alt="">
</div>
</el-col>
<el-col :span="13" style="height:95px">
<div style="color:#666666;font-size:14px;">从模版中选择其他封面图片</div>
<ul class="url2-list">
<li
class="img-wrapper"
v-for="(item, index) in attachMap[2]"
:key="index"
@click="selectedAttachUrl(item, 2)"
>
<img class="selected-icon" :src="item.attachmentUrl" alt="">
<img class="status-icon" v-show="item.checked" src="../../../assets/custom/icon/icon-select.png" alt />
<img class="status-icon" v-show="!item.checked" src="../../../assets/custom/icon/icon-select-no.png" alt />
</li>
</ul>
</el-col>
</el-form-item>
<el-form-item label="项目简介：" prop="projectIntro">
<el-col :span="13">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入项目简介"
v-model="formData.projectIntro"
style="width:83%;"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
</el-form>
<dialog-componet :dialogObj="dialogObj" @confirm="confirm" @hide="hide"></dialog-componet>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../../utils/qiniu-util";
import { openLoading, closeLoading } from "../../../utils/utils";
import ShoppingCart from '@/components/education/custom/sorted-cart'
import { convertTime } from "../../../utils";
import dialog from "./dialog";
import { mapGetters } from 'vuex';
let vm = null;
export default {
props: {
openTemplateId: {
type: String | Number,
default: ''
},
projectId: {
type: String | Number,
default: ''
},
editor: {
type: Boolean,
default: false
}
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
let checkUserTime= (rule, value, callback) => {
if (value> 1000 || value < 1) {
callback(new Error("输入长度为1-1000的有效期"));
} else {
callback();
}
};
return {
visibleName: false, //是否显示机构提示
orgListIndex: 1,
organizationContent: '',//机构名称
formData: {
id: "", //项目 id 26
projectName: "", //开放模板名称
projectBegintime: "", //模板开始时间
projectEndtime: "", //模板结束时间
projectIntro: "", //开放模板简介
projectType: 4, //类型
type: 1, //封面类型 1图片2视频
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
expireDay: 90, //模板有效期（天）
status4Flag: 0, //0表示没有上过架，1表示上过架
attachmentUrl1: "",
attachmentUrl2: "",
attachmentMore1: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
attachmentMore2: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
organizationName: "", // 发起机构名称（多个机构拼接
organizationNameList: [''] //发起机构列表
},
attachmentModel:[ //基础信息的图片视频
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
},
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
}
],
pickerOptions0: {
disabledDate: time => {
if (
vm.formData.projectEndtime != "" &&
vm.formData.projectEndtime != null
) {
return (
time.getTime() > new Date(vm.formData.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
// time.getTime() < new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() || time.getTime() > new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay
time.getTime() < new Date(vm.formData.projectBegintime).getTime() || time.getTime() > new Date(vm.formData.projectBegintime).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay
); //减去一天的时间代表可以选择同一天;
}
},
imgMouseOver: false,
imgMouseOver2: false,
uploadImgMessage: false,
uploadImgMessage2: false,
rules: {
projectName: [
{ required: true, message: "请输入项目名称" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
projectBegintime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectEndtime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectIntro: [
{ required: true, message: "请填写项目简介", trigger: "blur" },
{ min: 1, max: 200, message: "超出可输入的最大长度", trigger: "blur" }
]
},
disabled: true,
dialogObj: {
visible: false,
title: '该项目模版已下架',
tip: '',
message: '模版已下架，请重新选择其他项目模版',
confirmMsg: '取消',
hideMsg: '重新选择'
},
isPreview: 0,
attachMap: {
1: [],
2: []
},
}
},
computed: {
...mapGetters(['cartList']),
},
components: {
dialogComponet:dialog,
ShoppingCart
},
created() {
vm = this;
vm.isPreview = vm.$route.query.isPreview ? vm.$route.query.isPreview : 0;
if (vm.editor) {
// 编辑时
vm.disabled = false;
vm.getEditorMessage()
} else{
// 创建时
vm.disabled = true;
vm.getMessage();
}
},
methods: {
// 选择列表或封面图片
selectedAttachUrl(item, index) {
this.attachMap[index].forEach( attach => {
if(item.attachmentUrl == attach.attachmentUrl) {
attach.checked = true;
} else {
attach.checked = false;
}
})
vm.formData['attachmentUrl' + index] = item.attachmentUrl;
vm.$forceUpdate();
console.log(this.attachMap);
},
// 设置已有的基本信息
setBaseMessage(data) {
// data.projectData.projectBegintime = convertTime(data.projectData.projectBegintime);
// data.projectData.projectEndtime = convertTime(data.projectData.projectEndtime);
// vm.formData = Object.assign(vm.formData, data.projectData);
// vm.formData.attachmentUrl1 = data.attachmentData[0].attachmentUrl;
// vm.formData.attachmentMore1 = Object.assign(vm.formData.attachmentMore1, data.attachmentData[0]);
// 暂存为1 下一步为3
vm.formData.projectType = vm.formData.projectType == 0 ? 4 : vm.formData.projectType;
vm.formData.projectBegintime = vm.formData.projectBegintime ? new Date(vm.formData.projectBegintime) : '';
vm.formData.projectEndtime = vm.formData.projectBegintime ? new Date(vm.formData.projectEndtime) : '';
// if (data.attachmentData[1]) {
// vm.formData.attachmentUrl2 = data.attachmentData[1].attachmentUrl;
// vm.formData.type = data.attachmentData[1].attachmentType;
// vm.formData.attachmentMore2 = Object.assign(vm.formData.attachmentMore2, data.attachmentData[1]);
// }
// 不知道是否要使用
// vm.$emit('setStatus4Flag',data.projectData.status4Flag)
},
// // 设置已有的基本信息
// setBaseMessage(data) {
// data.projectData.projectBegintime = convertTime(data.projectData.projectBegintime);
// data.projectData.projectEndtime = convertTime(data.projectData.projectEndtime);
// vm.formData = Object.assign(vm.formData, data.projectData);
// vm.formData.attachmentUrl1 = data.attachmentData[0].attachmentUrl;
// vm.formData.attachmentMore1 = Object.assign(vm.formData.attachmentMore1, data.attachmentData[0]);
// // 暂存为1 下一步为3
// vm.formData.projectType = vm.formData.projectType == 0 ? 3 : vm.formData.projectType;
// vm.formData.projectBegintime = vm.formData.projectBegintime ? new Date(vm.formData.projectBegintime) : '';
// vm.formData.projectEndtime = vm.formData.projectBegintime ? new Date(vm.formData.projectEndtime) : '';
// if (data.attachmentData[1]) {
// vm.formData.attachmentUrl2 = data.attachmentData[1].attachmentUrl;
// vm.formData.type = data.attachmentData[1].attachmentType;
// vm.formData.attachmentMore2 = Object.assign(vm.formData.attachmentMore2, data.attachmentData[1]);
// }
// vm.$emit('setStatus4Flag',data.projectData.status4Flag)
// },
// 创建时，获取机构信息、列表图片等
getMessage() {
openLoading(vm);
vm.GET(`portal/portalInfo/sass/attach`, {typeList: [1,2]})
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.attachMap = res.data.attachMap;
this.attachMap[1].forEach(item => {
item.checked = false;
});
this.attachMap[2].forEach(item => {
item.checked = false;
});
this.formData.attachmentUrl1 = this.attachMap[1][0].attachmentUrl;
this.formData.attachmentUrl2 = this.attachMap[2][0].attachmentUrl;
this.formData.creatorOrganizationName = res.data.creatorOrganizationName || '';
this.attachMap[1][0].checked = true;
this.attachMap[2][0].checked = true;
console.log('this.attachMap', this.attachMap);
// let data = res.data;
// data.projectData.organizationNameList = [data.projectData.creatorOrganizationName]
// this.$emit('hideSave',res.data.projectData.projectStatus)
// vm.setBaseMessage(res.data);
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 获取选择模板后的基本信息
// getMessage() {
// openLoading(vm);
// vm.GET(`portal/openTemplateProject/getOpenTemplateInfoForCreate/${vm.openTemplateId}`)
// .then(res => {
// closeLoading(vm);
// if (res.code == "000000") {
// let data = res.data;
// data.projectData.organizationNameList = [data.projectData.creatorOrganizationName]
// this.$emit('hideSave',res.data.projectData.projectStatus)
// vm.setBaseMessage(res.data);
// } else {
// vm.$message.info(res.message);
// }
// })
// .catch((err) => {
// closeLoading(vm);
// vm.$message.warning('请稍后重试');
// });
// },
// 获取编辑时的信息
getEditorMessage() {
openLoading(vm);
// vm.GET(`portal/portalInfo/getProjectInfo/${vm.projectId}`)
vm.GET(`portal/portalCustom/getInfo/${vm.projectId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// this.$emit('hideSave',res.data.projectData.projectStatus)
vm.setBaseMessage(res.data)
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 增加发起机构
plusOrg(index) {
vm.formData.organizationNameList.splice(index + 1, 0, '');
},
// 删除发起机构
deleteOrg(index) {
vm.formData.organizationNameList.splice(index, 1);
},
// 机构名称输入
changeOrganizationName() {
let textLength = vm.formData.organizationName.length;
// 机构输入提示显示与否
vm.visibleName = textLength == 0;
},
// 离开机构名称焦点
blurName() {
vm.visibleName = false;
setTimeout(() => {
vm.submitForm("formData");
}, 200);
},
// 机构名称聚焦
focusName(index) {
let textLength = vm.formData.organizationNameList[index].length;
if (textLength == 0) {
vm.orgListIndex = index + 1;
vm.visibleName = true;
} else {
vm.visibleName = false;
}
},
// 机构选择默认值
checkDefault() {
vm.organizationContent = vm.formData.creatorOrganizationName;
vm.formData.organizationNameList.splice(vm.orgListIndex-1, 1, vm.organizationContent);
vm.visibleName = false;
},
//上传列表图片
// beforeUploadListPic(file) {
// let fileLimit = {
// width: 230,
// height: 172,
// size: 0.5,
// sizeText: "500K",
// key: "attachmentUrl1",
// more: "attachmentMore1",
// show: "uploadImgMessage"
// };
// vm.beforeAvatarUpload(file, fileLimit);
// },
//上传图片校验
// beforeAvatarUpload(file, fileLimit) {
// const isJPG = file.type === "image/jpeg";
// const isPNG = file.type === "image/png";
// const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
// if (!isJPG && !isPNG) {
// vm.$message.error("图片不符合规范，请根据规范上传图片");
// return;
// }
// if (!isLt2M) {
// vm.$message.error("图片不符合规范，请根据规范上传图片 ");
// return;
// }
// let _img = new FileReader();
// _img.readAsDataURL(file);
// _img.onload = function(theFile) {
// let image = new Image();
// image.src = theFile.target.result;
// image.onload = function() {
// let _vm = this;
// if (
// _vm.width != fileLimit.width ||
// _vm.height != fileLimit.height
// ) {
// vm.$message.error("图片不符合规范，请根据规范上传图片");
// } else {
// openLoading(vm);
// doUpload(
// vm,
// file,
// getFilePath(file, null),
// "preview4",
// "progress1",
// 1
// ).then(function(path) {
// closeLoading(vm);
// console.log(path);
// if (fileLimit.show == "uploadImgMessage") {
// vm.uploadImgMessage = false;
// } else if (fileLimit.show == "uploadImgMessage2") {
// vm.uploadImgMessage2 = false;
// }
// vm.formData[fileLimit.key] = path.fullPath;
// vm.formData[fileLimit.more] = {
// attachmentName: path.name,
// attachmentExt: path.ext,
// attachmentSize: path.size
// };
// vm.$message.success("上传成功");
// });
// }
// };
// };
// return isJPG && isLt2M;
// },
// // 删除图片
// deleteImg(type) {
// if (type == 1) {
// vm.formData.attachmentUrl1 = "";
// vm.imgMouseOver = false;
// } else {
// vm.formData.attachmentUrl2 = "";
// vm.imgMouseOver2 = false;
// }
// },
// //改变封面类型
// changeCover(radio) {
// vm.formData.attachmentUrl2 = "";
// },
// //上传封面图片
// beforeUploadCoverPic(file) {
// let fileLimit = {
// width: 750,
// height: 420,
// size: 2,
// sizeText: "2.0M",
// key: "attachmentUrl2",
// more: "attachmentMore2",
// show: "uploadImgMessage2"
// };
// if (vm.formData.type == 1) {
// vm.beforeAvatarUpload(file, fileLimit);
// } else {
// vm.beforeUploadMp4(file);
// }
// },
// //上传mp4
// beforeUploadMp4(file) {
// console.log(file);
// const isMP4 = file.type === "video/mp4";
// const isLt = file.size / 1024 / 1024 < 500;
// if (!isLt) {
// vm.$message.error("视频不符合规范，请根据规范上传视频");
// return;
// }
// if (!isMP4) {
// vm.$message.error("视频不符合规范，请根据规范上传视频");
// } else {
// openLoading(vm);
// doUpload(
// vm,
// file,
// getFilePath(file, null),
// "preview4",
// "progress1",
// ""
// ).then(function(path) {
// closeLoading(vm);
// console.log(path);
// vm.uploadImgMessage2 = false;
// vm.formData.attachmentUrl2 = path.fullPath;
// vm.$message.success("上传成功");
// });
// }
// },
// 点击下一步
nextStep() {
let flag = true;
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
flag = false;
} else {
vm.uploadImgMessage = false;
}
if (!vm.formData.attachmentUrl2) {
vm.uploadImgMessage2 = true;
flag = false;
} else {
vm.uploadImgMessage2 = false;
}
if (vm.submitForm('formData') && flag) {
vm.insertOrupdate();
}
},
// 暂存
save() {
if (vm.$refs['formData'].projectName == '') {
vm.$refs['formData'].validateField('projectName')
} else {
vm.insertOrupdate(1);
};
},
// 新增或者更新基本信息
insertOrupdate(status) {
if(new Date(vm.formData.projectEndtime).getTime() > new Date(vm.formData.projectBegintime).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay) {
vm.$message.warning('项目结束时间应在有效期内');
return;
}
if(new Date(vm.formData.projectEndtime).getTime() <= new Date(vm.formData.projectBegintime).getTime()) {
vm.$message.warning('项目结束时间应大于开始时间');
return;
}
vm.formData.projectBegintime = convertTime(vm.formData.projectBegintime, false);
vm.formData.projectEndtime = convertTime(vm.formData.projectEndtime, false);
if (status) {
vm.formData.projectStatus = status;
}
// 图片或者视频地址
vm.formData.attachmentMore1.attachmentUrl = vm.formData.attachmentUrl1;
vm.formData.attachmentMore2.attachmentUrl = vm.formData.attachmentUrl2;
// 封面类型
vm.formData.attachmentMore2.attachmentType = vm.formData.type;
vm.formData.attachmentMore2.kind = 2;
//整合图片视频
vm.attachmentModel[0] = Object.assign(vm.attachmentModel[0],vm.formData.attachmentMore1);
vm.attachmentModel[1] = Object.assign(vm.attachmentModel[1],vm.formData.attachmentMore2);
let baseobj = {};
baseobj.projectModel = JSON.stringify(vm.formData);
baseobj.attachmentModel = JSON.stringify(vm.attachmentModel);
baseobj.attachmentPDFModel= null;
baseobj.notifyData= null;
baseobj.hotCourseForPortalModelList = vm.cartList;
console.log(baseobj);
openLoading(vm);
vm.POST("portal/portalCustom/insertOrUpdate", baseobj)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// 暂存不会跳到下一页
if (status == 1) {
vm.$message.info('成功');
return;
}
// 下一步,并将项目id传递给父组件
vm.$emit('next',res.data.id);
} else if (res.code == "213061") {
vm.dialogObj.visible = true;
} else {
vm.$message.warning(res.message);
}
})
.catch((err) => {
vm.$message({
type: "warning",
message: res.message
});
})
},
//表单校验
submitForm(formName) {
let flag = null;
vm.$refs[formName].validate(valid => {
if (valid) {
flag = true;
} else {
flag = false;
}
});
return flag;
},
// 取消
confirm() {
vm.dialogObj.visible = false;
},
// 确定
hide() {
vm.dialogObj.visible = false;
vm.$emit('backSelectVue')
}
}
}
</script>
<style >
.subject-slelct .el-input__inner {
height: 32px;
line-height: 32px;
}
</style>
<style lang="scss" scoped>
.base-message-wrap {
padding-top: 80px;
.p_label {
margin-left: 56px;
font-size: 12px;
color: #606266;
}
.edit-img {
width: 20px;
height: 20px;
vertical-align: middle;
margin-left: 10px;
}
.day-btn {
display: inline-block;
width: 50px;
height: 32px;
line-height: 32px;
background: #838683;
text-align: center;
margin-left: -3px;
border-radius: 0 4px 4px 0;
z-index: 100;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
img {
float: left;
}
.bg-img {
width: 84px;
height: 100px;
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.choose-button {
background: #fff;
color: #409eff;
border: 1px solid #409eff;
}
.el-popover--plain {
padding: 18px 20px;
top: 40px;
}
.ueitem {
position: relative;
}
.ue-warp {
position: absolute;
width: 80%;
height: 100%;
background: #F5F7FA;
opacity: 0.5;
top: 0;
z-index: 1000;
}
}
.el-form-item__content {
width: 100%;
height: 100%;
background: red;
}
.popover-content {
position: relative;
top: 0;
left: 0;
}
.time-message {
margin: -6px 0 20px 150px;
font-size: 14px;
}
.url1-selected {
img {
widows: 120px;
height: 90px;
}
}
.url1-list {
display: flex;
flex-direction: row;
.img-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 1;
.selected-icon {
width: 60px;
height: 45px;
margin-right: 10px;
}
.status-icon {
position: absolute;
top: 5px;
right: 15px;
z-index: 2;
widows: 14px;
height: 14px;
}
}
}
.url2-selected {
img {
width: 160px;
height: 90px;
}
}
.url2-list {
display: flex;
flex-direction: row;
.img-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 1;
.selected-icon {
width: 80px;
height: 45px;
margin-right: 10px;
}
.status-icon {
position: absolute;
top: 5px;
right: 15px;
z-index: 2;
widows: 14px;
height: 14px;
}
}
}
.curt-position-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 100;
.curt-position {
position: absolute;
top: 0;
left: 0;
z-index: 101;
}
}
</style>
\ No newline at end of file
src/components/education/custom/custom-baseinfo 0526-1058.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<!--基础信息-->
<template>
<div class="base-message-wrap">
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
class="basic-form"
>
<el-form-item label="项目名称：" prop="projectName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.projectName"
placeholder="请输入项目名称"
style="width:70%;"
ref="projectName"
maxlength="24"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectName).replace(/\s+/g,"").length}}/24</span>
</el-col>
<el-col :span="10" class="curt-position-wrapper">
<div class="curt-position">
<ShoppingCart ></ShoppingCart>
</div>
</el-col>
</el-form-item>
<el-form-item label="发起机构名称：">
<el-col :span="13" v-for="(item, index) in formData.organizationNameList" :key="index">
<el-input
size="small"
v-model="formData.organizationNameList[index]"
placeholder="请输入发起机构名称"
style="width:70%;"
maxlength=16
@input="changeOrganizationName"
@blur = "blurName"
@focus = "focusName(index)"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.organizationNameList[index]).replace(/\s+/g,"").length}}/16</span>
<img @click="plusOrg(index)" class="edit-img" src="../../../assets/image/plus.png" v-if="isPreview!=1"/>
<img @click="deleteOrg(index)" v-if="index >= 1 && isPreview!=1" class="edit-img" src="../../../assets/image/trash.png" />
</el-col>
<el-popover
v-if="formData.creatorOrganizationName"
class="popover-content" :style="{'top': orgListIndex * 41 + 'px'}"
placement="bottom"
:content="organizationContent"
v-model="visibleName"
@click="checkDefault">
<p @click="checkDefault"> 我的机构： {{ formData.creatorOrganizationName }} </p>
</el-popover>
</el-form-item>
<div>
<el-form-item label="项目时间：" required>
<el-col :span="5">
<el-form-item prop="projectBegintime">
<el-date-picker
v-model="formData.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions0"
style="width: 100%;"
:disabled="formData.status4Flag == 1 || isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="1">~</el-col>
<el-col :span="5">
<el-form-item label prop="projectEndtime">
<el-date-picker
v-model="formData.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="00:00:00"
style="width: 100%;"
:disabled="isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<p class="time-message"><i class="el-icon-warning-outline"></i>项目有效期为{{formData.expireDay}}天,选择项目起止时间须在有效期内</p>
</div>
<el-form-item label="列表图片：" style="margin-bottom: 10px">
<el-col :span="13" style="height:95px">
<div class="url1-selected">
<img :src="formData.attachmentUrl1" alt="">
</div>
</el-col>
<el-col :span="13" style="height:95px">
<div style="color:#666666;font-size:14px;">从模版中选择其他列表图片</div>
<ul class="url1-list">
<li
class="img-wrapper"
v-for="(item, index) in attachMap[1]"
:key="index"
@click="selectedAttachUrl(item, 1)"
>
<img class="selected-icon" :src="item.attachmentUrl" alt="">
<img class="status-icon" v-show="item.checked" src="../../../assets/custom/icon/icon-select.png" alt />
<img class="status-icon" v-show="!item.checked" src="../../../assets/custom/icon/icon-select-no.png" alt />
</li>
</ul>
</el-col>
</el-form-item>
<el-form-item label="封面类型：">
<el-radio-group
size="small"
v-model="formData.type"
disabled
>
<el-radio :label="1">图片</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="封面文件：" style="margin-bottom: 10px">
<el-col :span="13" style="height: 95px">
<div class="url2-selected">
<img :src="formData.attachmentUrl2" alt="">
</div>
</el-col>
<el-col :span="13" style="height:95px">
<div style="color:#666666;font-size:14px;">从模版中选择其他封面图片</div>
<ul class="url2-list">
<li
class="img-wrapper"
v-for="(item, index) in attachMap[2]"
:key="index"
@click="selectedAttachUrl(item, 2)"
>
<img class="selected-icon" :src="item.attachmentUrl" alt="">
<img class="status-icon" v-show="item.checked" src="../../../assets/custom/icon/icon-select.png" alt />
<img class="status-icon" v-show="!item.checked" src="../../../assets/custom/icon/icon-select-no.png" alt />
</li>
</ul>
</el-col>
</el-form-item>
<el-form-item label="项目简介：" prop="projectIntro">
<el-col :span="13">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入项目简介"
v-model="formData.projectIntro"
style="width:83%;"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
</el-form>
<dialog-componet :dialogObj="dialogObj" @confirm="confirm" @hide="hide"></dialog-componet>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../../utils/qiniu-util";
import { openLoading, closeLoading } from "../../../utils/utils";
import ShoppingCart from '@/components/education/custom/sorted-cart'
import { convertTime } from "../../../utils";
import dialog from "./dialog";
import { mapGetters, mapActions } from 'vuex';
let vm = null;
export default {
props: {
openTemplateId: {
type: String | Number,
default: ''
},
projectId: {
type: String | Number,
default: ''
},
editor: {
type: Boolean,
default: false
}
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
let checkUserTime= (rule, value, callback) => {
if (value> 1000 || value < 1) {
callback(new Error("输入长度为1-1000的有效期"));
} else {
callback();
}
};
return {
visibleName: false, //是否显示机构提示
orgListIndex: 1,
organizationContent: '',//机构名称
formData: {
id: "", //项目 id 26
projectName: "", //开放模板名称
projectBegintime: "", //模板开始时间
projectEndtime: "", //模板结束时间
projectIntro: "", //开放模板简介
projectType: 4, //类型
type: 1, //封面类型 1图片2视频
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
expireDay: 90, //模板有效期（天）
status4Flag: 0, //0表示没有上过架，1表示上过架
attachmentUrl1: "",
attachmentUrl2: "",
attachmentMore1: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
attachmentMore2: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
organizationName: "", // 发起机构名称（多个机构拼接
organizationNameList: [''] //发起机构列表
},
attachmentModel:[ //基础信息的图片视频
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
},
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
}
],
pickerOptions0: {
disabledDate: time => {
if (
vm.formData.projectEndtime != "" &&
vm.formData.projectEndtime != null
) {
return (
time.getTime() > new Date(vm.formData.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
// time.getTime() < new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() || time.getTime() > new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay
time.getTime() < new Date(vm.formData.projectBegintime).getTime() || time.getTime() > new Date(vm.formData.projectBegintime).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay
); //减去一天的时间代表可以选择同一天;
}
},
imgMouseOver: false,
imgMouseOver2: false,
uploadImgMessage: false,
uploadImgMessage2: false,
rules: {
projectName: [
{ required: true, message: "请输入项目名称" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
projectBegintime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectEndtime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectIntro: [
{ required: true, message: "请填写项目简介", trigger: "blur" },
{ min: 1, max: 200, message: "超出可输入的最大长度", trigger: "blur" }
]
},
disabled: true,
dialogObj: {
visible: false,
title: '该项目模版已下架',
tip: '',
message: '模版已下架，请重新选择其他项目模版',
confirmMsg: '取消',
hideMsg: '重新选择'
},
isPreview: 0,
attachInfo: {
attachMap: {
1: [],
2: []
},
creatorOrganizationName: "云鹊医",
limitKind: 1,
limitValue: 90,
},
attachMap: {
1: [],
2: []
},
}
},
computed: {
...mapGetters(['cartList']),
},
components: {
dialogComponet:dialog,
ShoppingCart
},
created() {
vm = this;
vm.isPreview = vm.$route.query.isPreview ? vm.$route.query.isPreview : 0;
vm.getMessage();
// 编辑时
if (vm.editor) {
vm.disabled = false;
vm.getEditorMessage()
// 创建时
} else{
vm.disabled = true;
// vm.getMessage();
}
},
methods: {
...mapActions(['setCartList']),
// 选择列表或封面图片
selectedAttachUrl(item, index) {
this.attachMap[index].forEach( attach => {
if(item.attachmentUrl == attach.attachmentUrl) {
attach.checked = true;
} else {
attach.checked = false;
}
})
vm.formData['attachmentUrl' + index] = item.attachmentUrl;
vm.$forceUpdate();
},
// 设置已有的基本信息
setBaseMessage(data) {
data.projectData.projectBegintime = convertTime(data.projectData.projectBegintime);
data.projectData.projectEndtime = convertTime(data.projectData.projectEndtime);
vm.formData = Object.assign(vm.formData, data.projectData);
vm.formData.attachmentUrl1 = data.attachmentData[0].attachmentUrl;
vm.formData.attachmentMore1 = Object.assign(vm.formData.attachmentMore1, data.attachmentData[0]);
// 暂存为1 下一步为3
vm.formData.projectType = vm.formData.projectType == 0 ? 4 : vm.formData.projectType;
vm.formData.projectBegintime = vm.formData.projectBegintime ? new Date(vm.formData.projectBegintime) : '';
vm.formData.projectEndtime = vm.formData.projectBegintime ? new Date(vm.formData.projectEndtime) : '';
if (data.attachmentData[1]) {
vm.formData.attachmentUrl2 = data.attachmentData[1].attachmentUrl;
vm.formData.type = data.attachmentData[1].attachmentType;
vm.formData.attachmentMore2 = Object.assign(vm.formData.attachmentMore2, data.attachmentData[1]);
}
// 将所有课程设置到购物车中
console.log(data.hotCourseForPortalModelList.slice())
vm.setCartList(data.hotCourseForPortalModelList.slice());
// 不知道是否要使用
// vm.$emit('setStatus4Flag',data.projectData.status4Flag)
},
// // 设置已有的基本信息
// setBaseMessage(data) {
// data.projectData.projectBegintime = convertTime(data.projectData.projectBegintime);
// data.projectData.projectEndtime = convertTime(data.projectData.projectEndtime);
// vm.formData = Object.assign(vm.formData, data.projectData);
// vm.formData.attachmentUrl1 = data.attachmentData[0].attachmentUrl;
// vm.formData.attachmentMore1 = Object.assign(vm.formData.attachmentMore1, data.attachmentData[0]);
// // 暂存为1 下一步为3
// vm.formData.projectType = vm.formData.projectType == 0 ? 3 : vm.formData.projectType;
// vm.formData.projectBegintime = vm.formData.projectBegintime ? new Date(vm.formData.projectBegintime) : '';
// vm.formData.projectEndtime = vm.formData.projectBegintime ? new Date(vm.formData.projectEndtime) : '';
// if (data.attachmentData[1]) {
// vm.formData.attachmentUrl2 = data.attachmentData[1].attachmentUrl;
// vm.formData.type = data.attachmentData[1].attachmentType;
// vm.formData.attachmentMore2 = Object.assign(vm.formData.attachmentMore2, data.attachmentData[1]);
// }
// vm.$emit('setStatus4Flag',data.projectData.status4Flag)
// },
// 创建时，获取机构信息、列表图片等
getMessage() {
openLoading(vm);
vm.GET(`portal/portalInfo/sass/attach`, {typeList: [1,2]})
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.attachMap = res.data.attachMap;
this.attachMap[1].forEach(item => {
item.checked = false;
});
this.attachMap[2].forEach(item => {
item.checked = false;
});
this.formData.attachmentUrl1 = this.attachMap[1][0].attachmentUrl;
this.formData.attachmentUrl2 = this.attachMap[2][0].attachmentUrl;
this.formData.creatorOrganizationName = res.data.creatorOrganizationName || '';
this.attachMap[1][0].checked = true;
this.attachMap[2][0].checked = true;
console.log('this.attachMap', this.attachMap);
// let data = res.data;
// data.projectData.organizationNameList = [data.projectData.creatorOrganizationName]
// this.$emit('hideSave',res.data.projectData.projectStatus)
// vm.setBaseMessage(res.data);
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 获取选择模板后的基本信息
// getMessage() {
// openLoading(vm);
// vm.GET(`portal/openTemplateProject/getOpenTemplateInfoForCreate/${vm.openTemplateId}`)
// .then(res => {
// closeLoading(vm);
// if (res.code == "000000") {
// let data = res.data;
// data.projectData.organizationNameList = [data.projectData.creatorOrganizationName]
// this.$emit('hideSave',res.data.projectData.projectStatus)
// vm.setBaseMessage(res.data);
// } else {
// vm.$message.info(res.message);
// }
// })
// .catch((err) => {
// closeLoading(vm);
// vm.$message.warning('请稍后重试');
// });
// },
// 获取编辑时的信息
getEditorMessage() {
openLoading(vm);
// vm.GET(`portal/portalInfo/getProjectInfo/${vm.projectId}`)
vm.GET(`portal/portalCustom/getInfo/${vm.projectId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// this.$emit('hideSave',res.data.projectData.projectStatus)
vm.setBaseMessage(res.data)
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 增加发起机构
plusOrg(index) {
vm.formData.organizationNameList.splice(index + 1, 0, '');
},
// 删除发起机构
deleteOrg(index) {
vm.formData.organizationNameList.splice(index, 1);
},
// 机构名称输入
changeOrganizationName() {
let textLength = vm.formData.organizationName.length;
// 机构输入提示显示与否
vm.visibleName = textLength == 0;
},
// 离开机构名称焦点
blurName() {
vm.visibleName = false;
setTimeout(() => {
vm.submitForm("formData");
}, 200);
},
// 机构名称聚焦
focusName(index) {
let textLength = vm.formData.organizationNameList[index].length;
if (textLength == 0) {
vm.orgListIndex = index + 1;
vm.visibleName = true;
} else {
vm.visibleName = false;
}
},
// 机构选择默认值
checkDefault() {
vm.organizationContent = vm.formData.creatorOrganizationName;
vm.formData.organizationNameList.splice(vm.orgListIndex-1, 1, vm.organizationContent);
vm.visibleName = false;
},
//上传列表图片
// beforeUploadListPic(file) {
// let fileLimit = {
// width: 230,
// height: 172,
// size: 0.5,
// sizeText: "500K",
// key: "attachmentUrl1",
// more: "attachmentMore1",
// show: "uploadImgMessage"
// };
// vm.beforeAvatarUpload(file, fileLimit);
// },
//上传图片校验
// beforeAvatarUpload(file, fileLimit) {
// const isJPG = file.type === "image/jpeg";
// const isPNG = file.type === "image/png";
// const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
// if (!isJPG && !isPNG) {
// vm.$message.error("图片不符合规范，请根据规范上传图片");
// return;
// }
// if (!isLt2M) {
// vm.$message.error("图片不符合规范，请根据规范上传图片 ");
// return;
// }
// let _img = new FileReader();
// _img.readAsDataURL(file);
// _img.onload = function(theFile) {
// let image = new Image();
// image.src = theFile.target.result;
// image.onload = function() {
// let _vm = this;
// if (
// _vm.width != fileLimit.width ||
// _vm.height != fileLimit.height
// ) {
// vm.$message.error("图片不符合规范，请根据规范上传图片");
// } else {
// openLoading(vm);
// doUpload(
// vm,
// file,
// getFilePath(file, null),
// "preview4",
// "progress1",
// 1
// ).then(function(path) {
// closeLoading(vm);
// console.log(path);
// if (fileLimit.show == "uploadImgMessage") {
// vm.uploadImgMessage = false;
// } else if (fileLimit.show == "uploadImgMessage2") {
// vm.uploadImgMessage2 = false;
// }
// vm.formData[fileLimit.key] = path.fullPath;
// vm.formData[fileLimit.more] = {
// attachmentName: path.name,
// attachmentExt: path.ext,
// attachmentSize: path.size
// };
// vm.$message.success("上传成功");
// });
// }
// };
// };
// return isJPG && isLt2M;
// },
// // 删除图片
// deleteImg(type) {
// if (type == 1) {
// vm.formData.attachmentUrl1 = "";
// vm.imgMouseOver = false;
// } else {
// vm.formData.attachmentUrl2 = "";
// vm.imgMouseOver2 = false;
// }
// },
// //改变封面类型
// changeCover(radio) {
// vm.formData.attachmentUrl2 = "";
// },
// //上传封面图片
// beforeUploadCoverPic(file) {
// let fileLimit = {
// width: 750,
// height: 420,
// size: 2,
// sizeText: "2.0M",
// key: "attachmentUrl2",
// more: "attachmentMore2",
// show: "uploadImgMessage2"
// };
// if (vm.formData.type == 1) {
// vm.beforeAvatarUpload(file, fileLimit);
// } else {
// vm.beforeUploadMp4(file);
// }
// },
// //上传mp4
// beforeUploadMp4(file) {
// console.log(file);
// const isMP4 = file.type === "video/mp4";
// const isLt = file.size / 1024 / 1024 < 500;
// if (!isLt) {
// vm.$message.error("视频不符合规范，请根据规范上传视频");
// return;
// }
// if (!isMP4) {
// vm.$message.error("视频不符合规范，请根据规范上传视频");
// } else {
// openLoading(vm);
// doUpload(
// vm,
// file,
// getFilePath(file, null),
// "preview4",
// "progress1",
// ""
// ).then(function(path) {
// closeLoading(vm);
// console.log(path);
// vm.uploadImgMessage2 = false;
// vm.formData.attachmentUrl2 = path.fullPath;
// vm.$message.success("上传成功");
// });
// }
// },
// 点击下一步
nextStep() {
let flag = true;
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
flag = false;
} else {
vm.uploadImgMessage = false;
}
if (!vm.formData.attachmentUrl2) {
vm.uploadImgMessage2 = true;
flag = false;
} else {
vm.uploadImgMessage2 = false;
}
if (vm.submitForm('formData') && flag) {
vm.insertOrupdate();
}
},
// 暂存
save() {
if (vm.$refs['formData'].projectName == '') {
vm.$refs['formData'].validateField('projectName')
} else {
vm.insertOrupdate(1);
};
},
// 新增或者更新基本信息
insertOrupdate(status) {
if(new Date(vm.formData.projectEndtime).getTime() > new Date(vm.formData.projectBegintime).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay) {
vm.$message.warning('项目结束时间应在有效期内');
return;
}
if(new Date(vm.formData.projectEndtime).getTime() <= new Date(vm.formData.projectBegintime).getTime()) {
vm.$message.warning('项目结束时间应大于开始时间');
return;
}
vm.formData.projectBegintime = convertTime(vm.formData.projectBegintime, false);
vm.formData.projectEndtime = convertTime(vm.formData.projectEndtime, false);
if (status) {
vm.formData.projectStatus = status;
}
// 图片或者视频地址
vm.formData.attachmentMore1.attachmentUrl = vm.formData.attachmentUrl1;
vm.formData.attachmentMore2.attachmentUrl = vm.formData.attachmentUrl2;
// 封面类型
vm.formData.attachmentMore2.attachmentType = vm.formData.type;
vm.formData.attachmentMore2.kind = 2;
//整合图片视频
vm.attachmentModel[0] = Object.assign(vm.attachmentModel[0],vm.formData.attachmentMore1);
vm.attachmentModel[1] = Object.assign(vm.attachmentModel[1],vm.formData.attachmentMore2);
let baseobj = {};
baseobj.projectModel = JSON.stringify(vm.formData);
baseobj.attachmentModel = JSON.stringify(vm.attachmentModel);
baseobj.attachmentPDFModel= null;
baseobj.notifyData= null;
baseobj.hotCourseForPortalModelList = vm.cartList;
console.log(baseobj);
openLoading(vm);
vm.POST("portal/portalCustom/insertOrUpdate", baseobj)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// 暂存不会跳到下一页
if (status == 1) {
vm.$message.info('成功');
return;
}
// 下一步,并将项目id传递给父组件
vm.$emit('next',res.data.id);
} else if (res.code == "213061") {
vm.dialogObj.visible = true;
} else {
vm.$message.warning(res.message);
}
})
.catch((err) => {
vm.$message({
type: "warning",
message: res.message
});
})
},
//表单校验
submitForm(formName) {
let flag = null;
vm.$refs[formName].validate(valid => {
if (valid) {
flag = true;
} else {
flag = false;
}
});
return flag;
},
// 取消
confirm() {
vm.dialogObj.visible = false;
},
// 确定
hide() {
vm.dialogObj.visible = false;
vm.$emit('backSelectVue')
}
}
}
</script>
<style >
.subject-slelct .el-input__inner {
height: 32px;
line-height: 32px;
}
</style>
<style lang="scss" scoped>
.base-message-wrap {
padding-top: 80px;
.p_label {
margin-left: 56px;
font-size: 12px;
color: #606266;
}
.edit-img {
width: 20px;
height: 20px;
vertical-align: middle;
margin-left: 10px;
}
.day-btn {
display: inline-block;
width: 50px;
height: 32px;
line-height: 32px;
background: #838683;
text-align: center;
margin-left: -3px;
border-radius: 0 4px 4px 0;
z-index: 100;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
img {
float: left;
}
.bg-img {
width: 84px;
height: 100px;
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.choose-button {
background: #fff;
color: #409eff;
border: 1px solid #409eff;
}
.el-popover--plain {
padding: 18px 20px;
top: 40px;
}
.ueitem {
position: relative;
}
.ue-warp {
position: absolute;
width: 80%;
height: 100%;
background: #F5F7FA;
opacity: 0.5;
top: 0;
z-index: 1000;
}
}
.el-form-item__content {
width: 100%;
height: 100%;
background: red;
}
.popover-content {
position: relative;
top: 0;
left: 0;
}
.time-message {
margin: -6px 0 20px 150px;
font-size: 14px;
}
.url1-selected {
img {
widows: 120px;
height: 90px;
}
}
.url1-list {
display: flex;
flex-direction: row;
.img-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 1;
.selected-icon {
width: 60px;
height: 45px;
margin-right: 10px;
}
.status-icon {
position: absolute;
top: 5px;
right: 15px;
z-index: 2;
widows: 14px;
height: 14px;
}
}
}
.url2-selected {
img {
width: 160px;
height: 90px;
}
}
.url2-list {
display: flex;
flex-direction: row;
.img-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 1;
.selected-icon {
width: 80px;
height: 45px;
margin-right: 10px;
}
.status-icon {
position: absolute;
top: 5px;
right: 15px;
z-index: 2;
widows: 14px;
height: 14px;
}
}
}
.curt-position-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 100;
.curt-position {
position: absolute;
top: 0;
left: 0;
z-index: 101;
}
}
</style>
\ No newline at end of file
src/components/education/custom/custom-baseinfo 0526-1600.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<!--基础信息-->
<template>
<div class="base-message-wrap">
<el-form ref="formData" :model="formData" :rules="rules" label-width="150px" class="basic-form">
<el-form-item label="项目名称：" prop="projectName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.projectName"
placeholder="请输入项目名称"
style="width:70%;"
ref="projectName"
maxlength="24"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectName).replace(/\s+/g,"").length}}/24</span>
</el-col>
<el-col :span="10" class="curt-position-wrapper">
<div class="curt-position">
<SortedCart :isPreview="isPreview"></SortedCart>
</div>
</el-col>
</el-form-item>
<el-form-item label="发起机构名称：">
<el-col :span="13" v-for="(item, index) in formData.organizationNameList" :key="index">
<el-input
size="small"
v-model="formData.organizationNameList[index]"
placeholder="请输入发起机构名称"
style="width:70%;"
maxlength="16"
@input="changeOrganizationName"
@blur="blurName"
@focus="focusName(index)"
:disabled="isPreview==1"
></el-input>
<span
class="word-num"
>{{(formData.organizationNameList[index]).replace(/\s+/g,"").length}}/16</span>
<img
@click="plusOrg(index)"
class="edit-img"
src="../../../assets/image/plus.png"
v-if="isPreview!=1"
/>
<img
@click="deleteOrg(index)"
v-if="index >= 1 && isPreview!=1"
class="edit-img"
src="../../../assets/image/trash.png"
/>
</el-col>
<el-popover
v-if="formData.creatorOrganizationName"
class="popover-content"
:style="{'top': orgListIndex * 41 + 'px'}"
placement="bottom"
:content="organizationContent"
v-model="visibleName"
@click="checkDefault"
>
<p @click="checkDefault">我的机构： {{ formData.creatorOrganizationName }}</p>
</el-popover>
</el-form-item>
<div>
<el-form-item label="项目时间：" required>
<el-col :span="5">
<el-form-item prop="projectBegintime">
<el-date-picker
v-model="formData.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions0"
style="width: 100%;"
:disabled="formData.status4Flag == 1 || isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="1">~</el-col>
<el-col :span="5">
<el-form-item label prop="projectEndtime">
<el-date-picker
v-model="formData.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="00:00:00"
style="width: 100%;"
:disabled="isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<p class="time-message">
<i class="el-icon-warning-outline"></i>
项目有效期为{{attachInfo.limitValue}}天,选择项目起止时间须在有效期内
</p>
</div>
<el-form-item label="列表图片：" style="margin-bottom: 10px">
<el-col :span="13" style="height:95px">
<div class="url1-selected">
<img :src="formData.attachmentUrl1" alt />
</div>
</el-col>
<el-col :span="13" style="height:95px">
<div style="color:#666666;font-size:14px;">从模版中选择其他列表图片</div>
<ul class="url1-list">
<li
class="img-wrapper"
v-for="(item, index) in attachInfo.attachMap[1]"
:key="index"
@click="selectedAttachUrl(item.attachmentUrl, 1)"
>
<img class="selected-icon" :src="item.attachmentUrl" alt />
<img
class="status-icon"
v-show="item.checked"
src="../../../assets/custom/icon/icon-select.png"
alt
/>
<img
class="status-icon"
v-show="!item.checked"
src="../../../assets/custom/icon/icon-select-no.png"
alt
/>
</li>
</ul>
</el-col>
</el-form-item>
<el-form-item label="封面类型：">
<el-radio-group size="small" v-model="formData.type" disabled>
<el-radio :label="1">图片</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="封面文件：" style="margin-bottom: 10px">
<el-col :span="13" style="height: 95px">
<div class="url2-selected">
<img :src="formData.attachmentUrl2" alt />
</div>
</el-col>
<el-col :span="13" style="height:95px">
<div style="color:#666666;font-size:14px;">从模版中选择其他封面图片</div>
<ul class="url2-list">
<li
class="img-wrapper"
v-for="(item, index) in attachInfo.attachMap[2]"
:key="index"
@click="selectedAttachUrl(item.attachmentUrl, 2)"
>
<img class="selected-icon" :src="item.attachmentUrl" alt />
<img
class="status-icon"
v-show="item.checked"
src="../../../assets/custom/icon/icon-select.png"
alt
/>
<img
class="status-icon"
v-show="!item.checked"
src="../../../assets/custom/icon/icon-select-no.png"
alt
/>
</li>
</ul>
</el-col>
</el-form-item>
<el-form-item label="项目简介：" prop="projectIntro">
<el-col :span="13">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入项目简介"
v-model="formData.projectIntro"
style="width:83%;"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
</el-form>
<dialog-componet :dialogObj="dialogObj" @confirm="confirm" @hide="hide"></dialog-componet>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../../utils/qiniu-util";
import { openLoading, closeLoading } from "../../../utils/utils";
import SortedCart from "@/components/education/custom/sorted-cart";
import { convertTime } from "../../../utils";
import dialog from "./dialog";
import { mapGetters, mapActions } from "vuex";
let vm = null;
export default {
props: {
openTemplateId: {
type: String | Number,
default: ""
},
projectId: {
type: String | Number,
default: ""
},
editor: {
type: Boolean,
default: false
}
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
let checkUserTime = (rule, value, callback) => {
if (value > 1000 || value < 1) {
callback(new Error("输入长度为1-1000的有效期"));
} else {
callback();
}
};
return {
visibleName: false, //是否显示机构提示
orgListIndex: 1,
organizationContent: "", //机构名称
formData: {
id: "", //项目 id 26
projectName: "", //开放模板名称
projectBegintime: "", //模板开始时间
projectEndtime: "", //模板结束时间
projectIntro: "", //开放模板简介
projectType: 4, //类型
type: 1, //封面类型 1图片2视频
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
expireDay: 90, //模板有效期（天）
status4Flag: 0, //0表示没有上过架，1表示上过架
attachmentUrl1: "",
attachmentUrl2: "",
attachmentMore1: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
attachmentMore2: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
organizationName: "", // 发起机构名称（多个机构拼接
organizationNameList: [""] //发起机构列表
},
attachmentModel: [
//基础信息的图片视频
{
attachmentExt: "", // 附件格式
attachmentName: "", //附件名称
attachmentSize: "", //附件大小,
attachmentType: 1, //1：图片 2：视频 3：pdf
attachmentUrl: "", //附件链接
id: "", //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: "" //开放模板id
},
{
attachmentExt: "", // 附件格式
attachmentName: "", //附件名称
attachmentSize: "", //附件大小,
attachmentType: 1, //1：图片 2：视频 3：pdf
attachmentUrl: "", //附件链接
id: "", //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: "" //开放模板id
}
],
pickerOptions0: {
disabledDate: time => {
if (
vm.formData.projectEndtime != "" &&
vm.formData.projectEndtime != null
) {
return (
time.getTime() > new Date(vm.formData.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
// time.getTime() < new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() || time.getTime() > new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() + 1000 * 60 * 60 * 24 * vm.attachInfo.limitValue
time.getTime() < new Date(vm.formData.projectBegintime).getTime() ||
time.getTime() >
new Date(vm.formData.projectBegintime).getTime() +
1000 * 60 * 60 * 24 * vm.attachInfo.limitValue
); //减去一天的时间代表可以选择同一天;
}
},
imgMouseOver: false,
imgMouseOver2: false,
uploadImgMessage: false,
uploadImgMessage2: false,
rules: {
projectName: [
{ required: true, message: "请输入项目名称" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
projectBegintime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectEndtime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectIntro: [
{ required: true, message: "请填写项目简介", trigger: "blur" },
{ min: 1, max: 200, message: "超出可输入的最大长度", trigger: "blur" }
]
},
disabled: true,
dialogObj: {
visible: false,
title: "该项目模版已下架",
tip: "",
message: "模版已下架，请重新选择其他项目模版",
confirmMsg: "取消",
hideMsg: "重新选择"
},
isPreview: 0,
attachInfo: {
attachMap: {
1: [],
2: []
},
creatorOrganizationName: "云鹊医",
limitKind: 1,
limitValue: 90
},
attachMap: {
1: [],
2: []
}
};
},
computed: {
...mapGetters(["cartList"])
},
components: {
dialogComponet: dialog,
SortedCart
},
created() {
vm = this;
vm.isPreview = vm.$route.query.isPreview ? vm.$route.query.isPreview : 0;
// 编辑时
if (vm.editor) {
vm.disabled = false;
vm.getMessage(vm.editor);
// vm.getEditorMessage();
// 创建时
} else {
vm.disabled = true;
vm.getMessage(false);
}
},
methods: {
...mapActions(["setCartList"]),
// 选择列表或封面图片
selectedAttachUrl(attachmentUrl, index, isClick = true) {
// 查看状态，不可重新选择
if (isClick && vm.isPreview == 1) return;
this.attachInfo.attachMap[index].forEach(attach => {
if (attachmentUrl == attach.attachmentUrl) {
attach.checked = true;
} else {
attach.checked = false;
}
});
vm.formData["attachmentUrl" + index] = attachmentUrl;
vm.$forceUpdate();
},
// 设置已有的基本信息
setBaseMessage(data) {
data.projectData.projectBegintime = convertTime(data.projectData.projectBegintime);
data.projectData.projectEndtime = convertTime(data.projectData.projectEndtime);
vm.formData = Object.assign(vm.formData, data.projectData);
vm.formData.attachmentUrl1 = data.attachmentData[0].attachmentUrl;
vm.selectedAttachUrl(data.attachmentData[0].attachmentUrl, 1, false);
vm.formData.attachmentMore1 = Object.assign( vm.formData.attachmentMore1, data.attachmentData[0]);
// 暂存为1 下一步为3
vm.formData.projectType = vm.formData.projectType == 0 ? 4 : vm.formData.projectType;
vm.formData.projectBegintime = vm.formData.projectBegintime ? new Date(vm.formData.projectBegintime) : "";
vm.formData.projectEndtime = vm.formData.projectBegintime ? new Date(vm.formData.projectEndtime) : "";
if (data.attachmentData[1]) {
let attachmentUrl2 = data.attachmentData[1].attachmentUrl;
vm.selectedAttachUrl(attachmentUrl2, 2, false);
vm.formData.attachmentUrl2 = attachmentUrl2;
vm.formData.type = data.attachmentData[1].attachmentType;
vm.formData.attachmentMore2 = Object.assign(vm.formData.attachmentMore2, data.attachmentData[1]);
}
// 将所有课程设置到购物车中
vm.setCartList(data.hotCourseForPortalModelList.slice());
// 不知道是否要使用
// vm.$emit('setStatus4Flag',data.projectData.status4Flag)
},
// 创建时，获取机构信息、列表图片等
getMessage(isEdit = false) {
openLoading(vm);
vm.GET(`portal/portalInfo/sass/attach`, { typeList: [1, 2] })
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.attachInfo = res.data;
this.attachInfo.attachMap[1].forEach(item => {
item.checked = false;
});
this.attachInfo.attachMap[2].forEach(item => {
item.checked = false;
});
this.formData.attachmentUrl1 = this.attachInfo.attachMap[1][0].attachmentUrl;
this.formData.attachmentUrl2 = this.attachInfo.attachMap[2][0].attachmentUrl;
this.formData.creatorOrganizationName = this.attachInfo.creatorOrganizationName || "";
this.attachInfo.attachMap[1][0].checked = true;
this.attachInfo.attachMap[2][0].checked = true;
if(isEdit) {
vm.getEditorMessage();
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
// 获取选择模板后的基本信息
// getMessage() {
// openLoading(vm);
// vm.GET(`portal/openTemplateProject/getOpenTemplateInfoForCreate/${vm.openTemplateId}`)
// .then(res => {
// closeLoading(vm);
// if (res.code == "000000") {
// let data = res.data;
// data.projectData.organizationNameList = [data.projectData.creatorOrganizationName]
// this.$emit('hideSave',res.data.projectData.projectStatus)
// vm.setBaseMessage(res.data);
// } else {
// vm.$message.info(res.message);
// }
// })
// .catch((err) => {
// closeLoading(vm);
// vm.$message.warning('请稍后重试');
// });
// },
// 获取编辑时的信息
getEditorMessage() {
openLoading(vm);
vm.GET(`portal/portalCustom/getInfo/${vm.projectId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// this.$emit('hideSave',res.data.projectData.projectStatus)
vm.setBaseMessage(res.data);
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
// 增加发起机构
plusOrg(index) {
vm.formData.organizationNameList.splice(index + 1, 0, "");
},
// 删除发起机构
deleteOrg(index) {
vm.formData.organizationNameList.splice(index, 1);
},
// 机构名称输入
changeOrganizationName() {
let textLength = vm.formData.organizationName.length;
// 机构输入提示显示与否
vm.visibleName = textLength == 0;
},
// 离开机构名称焦点
blurName() {
vm.visibleName = false;
setTimeout(() => {
vm.submitForm("formData");
}, 200);
},
// 机构名称聚焦
focusName(index) {
let textLength = vm.formData.organizationNameList[index].length;
if (textLength == 0) {
vm.orgListIndex = index + 1;
vm.visibleName = true;
} else {
vm.visibleName = false;
}
},
// 机构选择默认值
checkDefault() {
vm.organizationContent = vm.formData.creatorOrganizationName;
vm.formData.organizationNameList.splice(
vm.orgListIndex - 1,
1,
vm.organizationContent
);
vm.visibleName = false;
},
// getFilePath(file, null),
// "preview4",
// "progress1",
// 1
// ).then(function(path) {
// closeLoading(vm);
// console.log(path);
// if (fileLimit.show == "uploadImgMessage") {
// vm.uploadImgMessage = false;
// } else if (fileLimit.show == "uploadImgMessage2") {
// vm.uploadImgMessage2 = false;
// }
// vm.formData[fileLimit.key] = path.fullPath;
// vm.formData[fileLimit.more] = {
// attachmentName: path.name,
// attachmentExt: path.ext,
// attachmentSize: path.size
// };
// vm.$message.success("上传成功");
// });
// }
// };
// };
// return isJPG && isLt2M;
// },
// // 删除图片
// deleteImg(type) {
// if (type == 1) {
// vm.formData.attachmentUrl1 = "";
// vm.imgMouseOver = false;
// } else {
// vm.formData.attachmentUrl2 = "";
// vm.imgMouseOver2 = false;
// }
// },
// //改变封面类型
// changeCover(radio) {
// vm.formData.attachmentUrl2 = "";
// },
// //上传封面图片
// beforeUploadCoverPic(file) {
// let fileLimit = {
// width: 750,
// height: 420,
// size: 2,
// sizeText: "2.0M",
// key: "attachmentUrl2",
// more: "attachmentMore2",
// show: "uploadImgMessage2"
// };
// if (vm.formData.type == 1) {
// vm.beforeAvatarUpload(file, fileLimit);
// } else {
// vm.beforeUploadMp4(file);
// }
// },
// //上传mp4
// beforeUploadMp4(file) {
// console.log(file);
// const isMP4 = file.type === "video/mp4";
// const isLt = file.size / 1024 / 1024 < 500;
// if (!isLt) {
// vm.$message.error("视频不符合规范，请根据规范上传视频");
// return;
// }
// if (!isMP4) {
// vm.$message.error("视频不符合规范，请根据规范上传视频");
// } else {
// openLoading(vm);
// doUpload(
// vm,
// file,
// getFilePath(file, null),
// "preview4",
// "progress1",
// ""
// ).then(function(path) {
// closeLoading(vm);
// console.log(path);
// vm.uploadImgMessage2 = false;
// vm.formData.attachmentUrl2 = path.fullPath;
// vm.$message.success("上传成功");
// });
// }
// },
// 点击下一步
nextStep() {
let flag = true;
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
flag = false;
} else {
vm.uploadImgMessage = false;
}
if (!vm.formData.attachmentUrl2) {
vm.uploadImgMessage2 = true;
flag = false;
} else {
vm.uploadImgMessage2 = false;
}
if (vm.submitForm("formData") && flag) {
vm.insertOrupdate();
}
},
// 暂存
save() {
if (vm.$refs["formData"].projectName == "") {
vm.$refs["formData"].validateField("projectName");
} else {
vm.insertOrupdate(1);
}
},
// 新增或者更新基本信息
insertOrupdate(status) {
if (
new Date(vm.formData.projectEndtime).getTime() >
new Date(vm.formData.projectBegintime).getTime() +
1000 * 60 * 60 * 24 * vm.attachInfo.limitValue
) {
vm.$message.warning("项目结束时间应在有效期内");
return;
}
if (
new Date(vm.formData.projectEndtime).getTime() <=
new Date(vm.formData.projectBegintime).getTime()
) {
vm.$message.warning("项目结束时间应大于开始时间");
return;
}
vm.formData.projectBegintime = convertTime(
vm.formData.projectBegintime,
false
);
vm.formData.projectEndtime = convertTime(
vm.formData.projectEndtime,
false
);
if (status) {
vm.formData.projectStatus = status;
}
// 图片或者视频地址
vm.formData.attachmentMore1.attachmentUrl = vm.formData.attachmentUrl1;
vm.formData.attachmentMore2.attachmentUrl = vm.formData.attachmentUrl2;
// 封面类型
vm.formData.attachmentMore2.attachmentType = vm.formData.type;
vm.formData.attachmentMore2.kind = 2;
//整合图片视频
vm.attachmentModel[0] = Object.assign(
vm.attachmentModel[0],
vm.formData.attachmentMore1
);
vm.attachmentModel[1] = Object.assign(
vm.attachmentModel[1],
vm.formData.attachmentMore2
);
let baseobj = {};
baseobj.projectModel = JSON.stringify(vm.formData);
baseobj.attachmentModel = JSON.stringify(vm.attachmentModel);
baseobj.attachmentPDFModel = null;
baseobj.notifyData = null;
baseobj.hotCourseForPortalModelList = vm.cartList;
console.log(baseobj);
openLoading(vm);
vm.POST("portal/portalCustom/insertOrUpdate", baseobj)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// 暂存不会跳到下一页
if (status == 1) {
vm.$message.info("成功");
return;
}
// 下一步,并将项目id传递给父组件
vm.$emit("next", res.data.id);
} else if (res.code == "213061") {
vm.dialogObj.visible = true;
} else {
vm.$message.warning(res.message);
}
})
.catch(err => {
vm.$message({
type: "warning",
message: res.message
});
});
},
//表单校验
submitForm(formName) {
let flag = null;
vm.$refs[formName].validate(valid => {
if (valid) {
flag = true;
} else {
flag = false;
}
});
return flag;
},
// 取消
confirm() {
vm.dialogObj.visible = false;
},
// 确定
hide() {
vm.dialogObj.visible = false;
vm.$emit("backSelectVue");
}
}
};
</script>
<style >
.subject-slelct .el-input__inner {
height: 32px;
line-height: 32px;
}
</style>
<style lang="scss" scoped>
.base-message-wrap {
padding-top: 80px;
.p_label {
margin-left: 56px;
font-size: 12px;
color: #606266;
}
.edit-img {
width: 20px;
height: 20px;
vertical-align: middle;
margin-left: 10px;
}
.day-btn {
display: inline-block;
width: 50px;
height: 32px;
line-height: 32px;
background: #838683;
text-align: center;
margin-left: -3px;
border-radius: 0 4px 4px 0;
z-index: 100;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
img {
float: left;
}
.bg-img {
width: 84px;
height: 100px;
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.choose-button {
background: #fff;
color: #409eff;
border: 1px solid #409eff;
}
.el-popover--plain {
padding: 18px 20px;
top: 40px;
}
.ueitem {
position: relative;
}
.ue-warp {
position: absolute;
width: 80%;
height: 100%;
background: #f5f7fa;
opacity: 0.5;
top: 0;
z-index: 1000;
}
}
.el-form-item__content {
width: 100%;
height: 100%;
background: red;
}
.popover-content {
position: relative;
top: 0;
left: 0;
}
.time-message {
margin: -6px 0 20px 150px;
font-size: 14px;
}
.url1-selected {
img {
widows: 120px;
height: 90px;
}
}
.url1-list {
display: flex;
flex-direction: row;
.img-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 1;
.selected-icon {
width: 60px;
height: 45px;
margin-right: 10px;
}
.status-icon {
position: absolute;
top: 5px;
right: 15px;
z-index: 2;
widows: 14px;
height: 14px;
}
}
}
.url2-selected {
img {
width: 160px;
height: 90px;
}
}
.url2-list {
display: flex;
flex-direction: row;
.img-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 1;
.selected-icon {
width: 80px;
height: 45px;
margin-right: 10px;
}
.status-icon {
position: absolute;
top: 5px;
right: 15px;
z-index: 2;
widows: 14px;
height: 14px;
}
}
}
.curt-position-wrapper {
position: relative;
top: 0;
left: 0;
z-index: 100;
.curt-position {
position: absolute;
top: 0;
left: 0;
z-index: 101;
}
}
</style>
\ No newline at end of file
src/components/education/custom/custom-baseinfo-templateMessage.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<!--基础信息-->
<template>
<div class="base-message-wrap">
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
class="basic-form"
>
<el-form-item label="项目名称：" prop="projectName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.projectName"
placeholder="请输入项目名称"
style="width:70%;"
ref="projectName"
maxlength="24"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectName).replace(/\s+/g,"").length}}/24</span>
</el-col>
</el-form-item>
<el-form-item label="发起机构名称：">
<el-col :span="13" v-for="(item, index) in formData.organizationNameList" :key="index">
<el-input
size="small"
v-model="formData.organizationNameList[index]"
placeholder="请输入发起机构名称"
style="width:70%;"
maxlength=16
@input="changeOrganizationName"
@blur = "blurName"
@focus = "focusName(index)"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.organizationNameList[index]).replace(/\s+/g,"").length}}/16</span>
<img @click="plusOrg(index)" class="edit-img" src="../../../assets/image/plus.png" v-if="isPreview!=1"/>
<img @click="deleteOrg(index)" v-if="index >= 1 && isPreview!=1" class="edit-img" src="../../../assets/image/trash.png" />
</el-col>
<el-popover
v-if="formData.creatorOrganizationName"
class="popover-content" :style="{'top': orgListIndex * 41 + 'px'}"
placement="bottom"
:content="organizationContent"
v-model="visibleName"
@click="checkDefault">
<p @click="checkDefault"> 我的机构： {{ formData.creatorOrganizationName }} </p>
</el-popover>
</el-form-item>
<div>
<el-form-item label="项目时间：" required>
<el-col :span="5">
<el-form-item prop="projectBegintime">
<el-date-picker
v-model="formData.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions0"
style="width: 100%;"
:disabled="formData.status4Flag == 1 || isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="1">~</el-col>
<el-col :span="5">
<el-form-item label prop="projectEndtime">
<el-date-picker
v-model="formData.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy/MM/dd HH:mm:ss"
format="yyyy/MM/dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="00:00:00"
style="width: 100%;"
:disabled="isPreview==1"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<p class="time-message"><i class="el-icon-warning-outline"></i>项目有效期为{{formData.expireDay}}天,选择项目起止时间须在有效期内</p>
</div>
<div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="列表图片：">
<el-upload
v-model="formData.attachmentUrl1"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
disabled
>
<img v-if="formData.attachmentUrl1" @mouseover.stop="imgMouseOver=true" :src="formData.attachmentUrl1" class="bg-img">
<img
v-if="!formData.attachmentUrl1"
class="bg-img"
src="../../../assets/image/small.png"
>
<div class="img-delete" v-show="imgMouseOver && false" @click.stop="deleteImg(1)" @mouseout.stop="imgMouseOver=false"><i class="el-icon-delete"></i></div>
<div class="limit-text">
<p>尺寸:230*172</p>
<p>限制大小: 500Kb</p>
<p>支持.jpg,.png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage">请选择列表图片</p>
</div>
<el-form-item label="封面类型：">
<el-radio-group
size="small"
v-model="formData.type"
@change="changeCover"
disabled
>
<el-radio :label="1">图片</el-radio>
<el-radio :label="2">视频</el-radio>
</el-radio-group>
</el-form-item>
<div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="封面文件：">
<el-upload
v-model="formData.attachmentUrl2"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadCoverPic"
disabled
>
<img
v-if="formData.type == 1 && formData.attachmentUrl2"
:src="formData.attachmentUrl2"
@mouseover.stop="imgMouseOver2=true"
class="bg-img"
>
<video
v-if="formData.type == 2 && formData.attachmentUrl2"
width="100"
controls
class="bg-video"
@mouseover.stop="imgMouseOver2=true"
>
<source :src="formData.attachmentUrl2" type="video/mp4">浏览器不支持mp4
</video>
<img
v-if="!formData.attachmentUrl2"
class="bg-img"
src="../../../assets/image/small.png"
>
<div class="img-delete" v-show="imgMouseOver2 && false" @click.stop="deleteImg(2)" @mouseout.stop="imgMouseOver2=false"><i class="el-icon-delete"></i></div>
<div v-show="formData.type == 1" class="limit-text">
<p>尺寸:750*420</p>
<p>限制大小: 2.0 Mb</p>
<p>支持.jpg,.png格式</p>
</div>
<div v-show="formData.type == 2" class="limit-text">
<p></p>
<p>限制大小: 500 Mb</p>
<p>支持.mp4</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage2">请选择封面</p>
</div>
<el-form-item label="项目简介：" prop="projectIntro">
<el-col :span="13">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入项目简介"
v-model="formData.projectIntro"
style="width:83%;"
:disabled="isPreview==1"
></el-input>
<span class="word-num">{{(formData.projectIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
</el-form>
<dialog-componet :dialogObj="dialogObj" @confirm="confirm" @hide="hide"></dialog-componet>
</div>
</template>
<script>
import { doUpload, getFilePath } from "../../../utils/qiniu-util";
import { openLoading, closeLoading } from "../../../utils/utils";
import { convertTime } from "../../../utils";
import dialog from "./dialog";
let vm = null;
export default {
props: {
openTemplateId: {
type: String | Number,
default: ''
},
projectId: {
type: String | Number,
default: ''
},
editor: {
type: Boolean,
default: false
}
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
let checkUserTime= (rule, value, callback) => {
if (value> 1000 || value < 1) {
callback(new Error("输入长度为1-1000的有效期"));
} else {
callback();
}
};
return {
visibleName: false, //是否显示机构提示
orgListIndex: 1,
organizationContent: '',//机构名称
formData: {
id: "", //项目 id 26
projectName: "", //开放模板名称
projectBegintime: "", //模板开始时间
projectEndtime: "", //模板结束时间
projectIntro: "", //开放模板简介
projectType: 3, //类型
type: 1, //封面类型 1图片2视频
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
expireDay: 1, //模板有效期（天）
status4Flag: 0, //0表示没有上过架，1表示上过架
attachmentUrl1: "",
attachmentUrl2: "",
attachmentUrl3: "",
attachmentMore1: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
attachmentMore2: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
organizationName: "", // 发起机构名称（多个机构拼接
organizationNameList: [''] //发起机构列表
},
attachmentModel:[ //基础信息的图片视频
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
},
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
}
],
pickerOptions0: {
disabledDate: time => {
if (
vm.formData.projectEndtime != "" &&
vm.formData.projectEndtime != null
) {
return (
time.getTime() > new Date(vm.formData.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
// time.getTime() < new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() || time.getTime() > new Date((vm.formData.projectBegintime).replace(/\-/g, '/')).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay
time.getTime() < new Date(vm.formData.projectBegintime).getTime() || time.getTime() > new Date(vm.formData.projectBegintime).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay
); //减去一天的时间代表可以选择同一天;
}
},
imgMouseOver: false,
imgMouseOver2: false,
uploadImgMessage: false,
uploadImgMessage2: false,
rules: {
projectName: [
{ required: true, message: "请输入项目名称" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
projectBegintime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectEndtime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
projectIntro: [
{ required: true, message: "请填写项目简介", trigger: "blur" },
{ min: 1, max: 200, message: "超出可输入的最大长度", trigger: "blur" }
]
},
disabled: true,
dialogObj: {
visible: false,
title: '该项目模版已下架',
tip: '',
message: '模版已下架，请重新选择其他项目模版',
confirmMsg: '取消',
hideMsg: '重新选择'
},
isPreview: 0
}
},
components: {
dialogComponet:dialog
},
created() {
vm = this;
vm.isPreview = vm.$route.query.isPreview ? vm.$route.query.isPreview : 0;
if (vm.editor) {
// 编辑时
vm.disabled = false;
vm.getEditorMessage()
} else{
// 创建时
vm.disabled = true;
vm.getMessage();
}
},
methods: {
// 设置已有的基本信息
setBaseMessage(data) {
data.projectData.projectBegintime = convertTime(data.projectData.projectBegintime);
data.projectData.projectEndtime = convertTime(data.projectData.projectEndtime);
vm.formData = Object.assign(vm.formData, data.projectData);
vm.formData.attachmentUrl1 = data.attachmentData[0].attachmentUrl;
vm.formData.attachmentMore1 = Object.assign(vm.formData.attachmentMore1, data.attachmentData[0]);
// 暂存为1 下一步为3
vm.formData.projectType = vm.formData.projectType == 0 ? 3 : vm.formData.projectType;
vm.formData.projectBegintime = vm.formData.projectBegintime ? new Date(vm.formData.projectBegintime) : '';
vm.formData.projectEndtime = vm.formData.projectBegintime ? new Date(vm.formData.projectEndtime) : '';
if (data.attachmentData[1]) {
vm.formData.attachmentUrl2 = data.attachmentData[1].attachmentUrl;
vm.formData.type = data.attachmentData[1].attachmentType;
vm.formData.attachmentMore2 = Object.assign(vm.formData.attachmentMore2, data.attachmentData[1]);
}
vm.$emit('setStatus4Flag',data.projectData.status4Flag)
},
// 获取选择模板后的基本信息
getMessage() {
openLoading(vm);
vm.GET(`portal/openTemplateProject/getOpenTemplateInfoForCreate/${vm.openTemplateId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
let data = res.data;
data.projectData.organizationNameList = [data.projectData.creatorOrganizationName]
this.$emit('hideSave',res.data.projectData.projectStatus)
vm.setBaseMessage(res.data);
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 获取编辑时的信息
getEditorMessage() {
openLoading(vm);
vm.GET(`portal/portalInfo/getProjectInfo/${vm.projectId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.$emit('hideSave',res.data.projectData.projectStatus)
vm.setBaseMessage(res.data)
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 增加发起机构
plusOrg(index) {
vm.formData.organizationNameList.splice(index + 1, 0, '');
},
// 删除发起机构
deleteOrg(index) {
vm.formData.organizationNameList.splice(index, 1);
},
// 机构名称输入
changeOrganizationName() {
let textLength = vm.formData.organizationName.length;
// 机构输入提示显示与否
vm.visibleName = textLength == 0;
},
// 离开机构名称焦点
blurName() {
vm.visibleName = false;
setTimeout(() => {
vm.submitForm("formData");
}, 200);
},
// 机构名称聚焦
focusName(index) {
let textLength = vm.formData.organizationNameList[index].length;
if (textLength == 0) {
vm.orgListIndex = index + 1;
vm.visibleName = true;
} else {
vm.visibleName = false;
}
},
// 机构选择默认值
checkDefault() {
vm.organizationContent = vm.formData.creatorOrganizationName;
vm.formData.organizationNameList.splice(vm.orgListIndex-1, 1, vm.organizationContent);
vm.visibleName = false;
},
//上传列表图片
beforeUploadListPic(file) {
let fileLimit = {
width: 230,
height: 172,
size: 0.5,
sizeText: "500K",
key: "attachmentUrl1",
more: "attachmentMore1",
show: "uploadImgMessage"
};
vm.beforeAvatarUpload(file, fileLimit);
},
//上传图片校验
beforeAvatarUpload(file, fileLimit) {
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
if (!isJPG && !isPNG) {
vm.$message.error("图片不符合规范，请根据规范上传图片");
return;
}
if (!isLt2M) {
vm.$message.error("图片不符合规范，请根据规范上传图片 ");
return;
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function(theFile) {
let image = new Image();
image.src = theFile.target.result;
image.onload = function() {
let _vm = this;
if (
_vm.width != fileLimit.width ||
_vm.height != fileLimit.height
) {
vm.$message.error("图片不符合规范，请根据规范上传图片");
} else {
openLoading(vm);
doUpload(
vm,
file,
getFilePath(file, null),
"preview4",
"progress1",
1
).then(function(path) {
closeLoading(vm);
console.log(path);
if (fileLimit.show == "uploadImgMessage") {
vm.uploadImgMessage = false;
} else if (fileLimit.show == "uploadImgMessage2") {
vm.uploadImgMessage2 = false;
}
vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = {
attachmentName: path.name,
attachmentExt: path.ext,
attachmentSize: path.size
};
vm.$message.success("上传成功");
});
}
};
};
return isJPG && isLt2M;
},
// 删除图片
deleteImg(type) {
if (type == 1) {
vm.formData.attachmentUrl1 = "";
vm.imgMouseOver = false;
} else {
vm.formData.attachmentUrl2 = "";
vm.imgMouseOver2 = false;
}
},
//改变封面类型
changeCover(radio) {
vm.formData.attachmentUrl2 = "";
},
//上传封面图片
beforeUploadCoverPic(file) {
let fileLimit = {
width: 750,
height: 420,
size: 2,
sizeText: "2.0M",
key: "attachmentUrl2",
more: "attachmentMore2",
show: "uploadImgMessage2"
};
if (vm.formData.type == 1) {
vm.beforeAvatarUpload(file, fileLimit);
} else {
vm.beforeUploadMp4(file);
}
},
//上传mp4
beforeUploadMp4(file) {
console.log(file);
const isMP4 = file.type === "video/mp4";
const isLt = file.size / 1024 / 1024 < 500;
if (!isLt) {
vm.$message.error("视频不符合规范，请根据规范上传视频");
return;
}
if (!isMP4) {
vm.$message.error("视频不符合规范，请根据规范上传视频");
} else {
openLoading(vm);
doUpload(
vm,
file,
getFilePath(file, null),
"preview4",
"progress1",
""
).then(function(path) {
closeLoading(vm);
console.log(path);
vm.uploadImgMessage2 = false;
vm.formData.attachmentUrl2 = path.fullPath;
vm.$message.success("上传成功");
});
}
},
// 点击下一步
nextStep() {
let flag = true;
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
flag = false;
} else {
vm.uploadImgMessage = false;
}
if (!vm.formData.attachmentUrl2) {
vm.uploadImgMessage2 = true;
flag = false;
} else {
vm.uploadImgMessage2 = false;
}
if (vm.submitForm('formData') && flag) {
vm.insertOrupdate();
}
},
// 暂存
save() {
if (vm.$refs['formData'].projectName == '') {
vm.$refs['formData'].validateField('projectName')
} else {
vm.insertOrupdate(1);
};
},
// 新增或者更新基本信息
insertOrupdate(status) {
if(new Date(vm.formData.projectEndtime).getTime() > new Date(vm.formData.projectBegintime).getTime() + 1000 * 60 * 60 * 24 * vm.formData.expireDay) {
vm.$message.warning('项目结束时间应在有效期内');
return;
}
if(new Date(vm.formData.projectEndtime).getTime() <= new Date(vm.formData.projectBegintime).getTime()) {
vm.$message.warning('项目结束时间应大于开始时间');
return;
}
vm.formData.projectBegintime = convertTime(vm.formData.projectBegintime, false);
vm.formData.projectEndtime = convertTime(vm.formData.projectEndtime, false);
if (status) {
vm.formData.projectStatus = status;
}
// 图片或者视频地址
vm.formData.attachmentMore1.attachmentUrl = vm.formData.attachmentUrl1;
vm.formData.attachmentMore2.attachmentUrl = vm.formData.attachmentUrl2;
// 封面类型
vm.formData.attachmentMore2.attachmentType = vm.formData.type;
vm.formData.attachmentMore2.kind = 2;
//整合图片视频
vm.attachmentModel[0] = Object.assign(vm.attachmentModel[0],vm.formData.attachmentMore1);
vm.attachmentModel[1] = Object.assign(vm.attachmentModel[1],vm.formData.attachmentMore2);
let baseobj = {};
baseobj.projectModel = JSON.stringify(vm.formData);
baseobj.attachmentModel = JSON.stringify(vm.attachmentModel);
baseobj.attachmentPDFModel= null;
baseobj.notifyData= null;
openLoading(vm);
vm.POST("portal/portalInfo/insertOrUpdate", baseobj)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
// 暂存不会跳到下一页
if (status == 1) {
vm.$message.info('成功');
return;
}
// 下一步,并将项目id传递给父组件
vm.$emit('next',res.data.id);
} else if (res.code == "213061") {
vm.dialogObj.visible = true;
} else {
vm.$message.warning(res.message);
}
})
.catch((err) => {
vm.$message({
type: "warning",
message: res.message
});
})
},
//表单校验
submitForm(formName) {
let flag = null;
vm.$refs[formName].validate(valid => {
if (valid) {
flag = true;
} else {
flag = false;
}
});
return flag;
},
// 取消
confirm() {
vm.dialogObj.visible = false;
},
// 确定
hide() {
vm.dialogObj.visible = false;
vm.$emit('backSelectVue')
}
}
}
</script>
<style >
.subject-slelct .el-input__inner {
height: 32px;
line-height: 32px;
}
</style>
<style lang="scss" scoped>
.base-message-wrap {
padding-top: 80px;
.p_label {
margin-left: 56px;
font-size: 12px;
color: #606266;
}
.edit-img {
width: 20px;
height: 20px;
vertical-align: middle;
margin-left: 10px;
}
.day-btn {
display: inline-block;
width: 50px;
height: 32px;
line-height: 32px;
background: #838683;
text-align: center;
margin-left: -3px;
border-radius: 0 4px 4px 0;
z-index: 100;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
img {
float: left;
}
.bg-img {
width: 84px;
height: 100px;
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.choose-button {
background: #fff;
color: #409eff;
border: 1px solid #409eff;
}
.el-popover--plain {
padding: 18px 20px;
top: 40px;
}
.ueitem {
position: relative;
}
.ue-warp {
position: absolute;
width: 80%;
height: 100%;
background: #F5F7FA;
opacity: 0.5;
top: 0;
z-index: 1000;
}
}
.el-form-item__content {
width: 100%;
height: 100%;
background: red;
}
.popover-content {
position: relative;
top: 0;
left: 0;
}
.time-message {
margin: -6px 0 20px 150px;
font-size: 14px;
}
</style>
\ No newline at end of file
src/views/education/edit-cme copy.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
因为 它太大了无法显示 源差异 。您可以改为 查看blob。
src/views/education/edit-custom copy 2.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="edit-custom-wrap">
<bread-crumb
:curmbFirst="curmbFirst"
:curmbSecond="curmbSecond"
:curmbThird="curmbThird"
:jumPathThird="jumPathThird"
></bread-crumb>
<div class="add-content screenSet" id="screenSet">
<el-row class="step-content-new">
<el-col style="width: 700px;">
<el-steps :active="active" simple class>
<span class="step-num" v-bind:class="{ 'on-step': active==0 }">1</span>
<el-step title="选择项目课程">1</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==1 }">2</span>
<el-step title="填写项目信息">2</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==2 }">3</span>
<el-step title="选择学员范围">3</el-step>
</el-steps>
</el-col>
<el-col style="margin-left: 236px; width: 200px;margin-top: 2px;">
<!-- <el-col :span="5" :offset="5"> -->
<div v-if="!canNext" class="dis-btn">下一步</div>
<el-button class="dis-btn-b" v-if="active != 0 && projectStatus == 1 && isPreview != 1" size="small" @click="save">暂存</el-button>
<el-button class="dis-btn-b" v-if="active !== 2 && canNext" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button class="dis-btn-b" v-if="active == 2" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<!-- 模板列表
<div v-if="active == 0" class="tpl-main">
<template-list @checkFn="checkFn"></template-list>
</div>-->
<!-- 选择课程 -->
<div v-if="active == 0" class="tpl-main">
<SelectCourseComp></SelectCourseComp>
</div>
<!-- 填写项目信息-->
<!-- <template-message -->
<custom-baseinfo
ref="CustomBaseinfo"
v-if="active == 1"
:openTemplateId="openTemplateId"
:projectId="projectId"
:editor="editor"
@next="next"
@backSelectVue="backSelectVue"
@hideSave="hideSave"
@setStatus4Flag="setStatus4Flag"
/>
<!-- 设定行政范围与设定机构 -->
<div class="three-step" v-if="active === 2">
<el-tabs v-model="activeName" @tab-click="handleClickTabs">
<el-tab-pane label="设定行政范围" name="first">
<select-region ref="selectRegion" :projectId="projectId" :status4Flag="status4Flag"></select-region>
</el-tab-pane>
<el-tab-pane label="设定机构" name="second">
<set-organization
ref="setOrganization"
:projectId="projectId"
:status4Flag="status4Flag"
></set-organization>
</el-tab-pane>
</el-tabs>
</div>
</div>
<dialog-componet :dialogObj="dialogObj" @hide="hide"></dialog-componet>
<dialog-componet :dialogObj="sendObj" @hide="hidefn" @confirm="confirmFn"></dialog-componet>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
// import CustomBaseinfo from "@/components/education/template/CustomBaseinfo";
import CustomBaseinfo from "@/components/education/custom/custom-baseinfo";
import selectTemplate from "@/components/education/template/selectTemplate";
import selectRegion from "@/components/education/template/selectRegion";
import setOrganization from "@/components/education/template/setOrganization";
import SelectCourseComp from "@/components/education/custom/select-course-comp";
import dialog from "@/components/education/template/dialog";
import { openLoading, closeLoading, resizeHeight } from "@/utils/utils";
import { mapGetters, mapActions } from "vuex";
let vm = null;
export default {
data() {
return {
curmbFirst: "教培项目",
curmbSecond: "项目管理",
jumPathThird: "item-manager",
curmbThird: "发起项目",
active: 0,
formTemplate: {
component: [],
configure: 2,
certificate: ""
},
activeName: "first",
canNext: false,
openTemplateId: 0, // 开放模板ID
projectId: "", // 项目id
status: 10, // 0正常10没有加入机构11审核中12审核失败20存在进行中项目21数量已达上限
editor: false, // 是否为编辑状态
dialogObj: {
visible: false,
title: "",
message: "",
tip: "",
hideMsg: ""
},
statusObj: {
status_10: {
title: "您暂未加入机构",
message: "请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后，可创建项目",
tip: "",
hideMsg: "我知道了"
},
status_11: {
title: "您创建的机构正在审核中",
message: "请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后，可创建项目",
tip: "",
hideMsg: "我知道了"
},
status_12: {
title: "您创建的机构审核不通过",
message: "请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后，可创建项目",
tip: "",
hideMsg: "我知道了"
},
status_20: {
title: "该项目正在进行中",
message: "不能重复创建,请选择其他模版或者下架正在进行中的项目",
hideMsg: "确定"
},
status_21: {
title: "自定义项目创建数量已达上限",
message: "本年度免费创建自定义项目数已达20次，不能继续创建",
hideMsg: "确定"
}
},
sendObj: {
// 发布
visible: false,
title: "确定发布吗?",
message:
"发布后,项目将进入审核中,待审核完成后学员可在云鹊医App上参加培训学习",
tip: "",
confirmMsg: "取消",
hideMsg: "确定发布"
},
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
status4Flag: 0, //0表示没有上过架，1表示上过架
isPreview: 0, // 1表示是查看信息
maxLimitCreatedCustomProjectCountInYear: 20, // 同一个用户每年能够创建的项目数
allSubList: [],
};
},
computed: {
...mapGetters(["searchParam", "cartList"])
},
watch: {
searchParam: {
handler(val) {
this.getCourseList(val);
},
deep: true
},
cartList(val) {
this.canNext = val.length > 0;
}
},
components: {
BreadCrumb,
CustomBaseinfo,
selectTemplate,
selectRegion,
setOrganization,
dialogComponet: dialog,
SelectCourseComp
},
created() {
vm = this;
vm.isEditorFn();
vm.isPreviewFn();
},
mounted() {
resizeHeight();
this.getLabelList();
this.initPageParams();
// this.initPageParams();
},
methods: {
...mapActions([
"setSearchParam",
"setCartList",
"setCourseList",
"setAllLabelList",
"setSubLabelList",
"setCourseLimitCount",
]),
initPageParams(labelIdList) {
let searchParam = {
orderBy: 2,
dir: 1,
grade: 0,
pageNo: 1,
pageSize: 10,
labelIdList: labelIdList || []
};
this.setCartList([]);
this.setCourseList([]);
this.setAllLabelList([]);
this.setSubLabelList([]);
this.courseLimitCount();
// this.getLabelList();
// this.getCourseList(searchParam);
},
// 自定义项目--选择课程个数限制(-1表示不限制)
courseLimitCount() {
vm.GET("portal/portalCustom/courseLimitCount", {}).then(res => {
if (res.code == "000000") {
this.setCourseLimitCount(res.data);
}
});
},
// 获取所有标签（一级及二级）,交做相应处理
getLabelList() {
vm.GET("contents/diseases/labelList", {}).then(res => {
if (res.code == "000000") {
// 先将所有的标签添加checked字段
let labelList = res.data;
let allSubList = [];
let labelIdList = [];
labelList.forEach((item, index) => {
item.checked = false;
item.subList.forEach((sub, subIndex) => {
sub.parentIndex = index;
sub.checked = true;
if (subIndex == 0) {
sub.id = `subid-${index}`; // 将二级中的“全部”id改为可以识别的
} else {
allSubList.push(sub);
labelIdList.push(sub.id);
}
});
});
// 构建其子标签
allSubList.unshift({
name: "全部",
checked: true,
id: 'parentid-0'
});
// 添加一级的“全部”标签，并构建其子标签
labelList.unshift({
name: "全部",
checked: true,
subList: allSubList
});
// this.initPageParams(labelIdList);
this.setAllLabelList(labelList);
this.setSubLabelList(allSubList);
let searchParam = {
orderBy: 2,
dir: 1,
grade: 0,
pageNo: 1,
pageSize: 10,
labelIdList: labelIdList || []
};
this.setSearchParam(searchParam);
}
});
},
// （根据条件）查询课程
getCourseList(searchParam) {
vm.GET("contents/diseases/courseListForPortal", searchParam).then(res => {
if (res.code == "000000") {
let courseList = res.data, cartIndex = -1;
courseList.list.forEach(item => {
cartIndex = vm.cartList.findIndex( current => {
return current.courseId == item.courseId;
})
if(cartIndex >= 0) {
item.checked = true;
} else {
item.checked = false;
}
});
this.setCourseList(courseList);
}
});
},
// 判断是否为编辑状态
isEditorFn() {
if (vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.editor = true;
vm.active = 1;
vm.canNext = true;
}
},
// 判断是否为预览状态
isPreviewFn() {
if (vm.$route.query.isPreview == 1 && vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.isPreview = vm.$route.query.isPreview;
vm.active = 1;
vm.canNext = true;
}
},
// 按钮点击下一步
nextStep() {
if (vm.active == 0) {
vm.checkSelectCustomCourse();
// vm.checkSelectTemplate()
return;
}
if (vm.active == 1) {
// 查看时，点击下一步直接跳
if (vm.isPreview == 1) {
vm.active = 2;
return;
}
// 调用项目信息中的下一步操作
vm.$refs.CustomBaseinfo.nextStep();
return;
}
},
// 填写项目信息组件的下一步回调（获取项目id）
next(id) {
vm.projectId = id;
vm.active = 2;
},
// 暂存
save() {
if (vm.active == 1) {
vm.$refs.CustomBaseinfo.save(false);
} else if (vm.active == 2) {
vm.regionComplete();
}
},
confirmFn() {
vm.sendObj.visible = false;
},
// 完成
complete() {
// 4不弹框
if (vm.projectStatus != 4 && vm.isPreview != 1) {
vm.sendObj.visible = true;
} else {
// 查看时,点击完成直接跳到列表页
if (vm.isPreview == 1) {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "item-manager", query: query });
return;
}
vm.hidefn();
}
},
// 完成触发的接口
hidefn() {
vm.regionComplete(vm.changeStatus);
},
// 选择学元范围暂存
regionComplete(fishFn) {
let req = {
projectId: vm.projectId,
scopeOfAdministrative: vm.$refs.selectRegion.setScope(),
scopeOfDepartment: 99999999,
flag: fishFn ? 3 : 1 //0：下一步 1：暂存
};
openLoading(vm);
vm.POST("portal/new/scope", req)
.then(res => {
closeLoading(vm);
if (res.code == "000000" && fishFn) {
fishFn();
}
if (!fishFn) {
vm.$message({
type: "info",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
});
},
// 完成后更改状态
changeStatus() {
let req = {
projectId: vm.projectId,
changeStatus: 3 //待审核
};
vm.POST("portal/portalInfo/changeStatus", req)
.then(res => {
vm.sendObj.visible = false;
if (res.code == "000000") {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
console.log("vm.$router.push");
vm.$router.push({ path: "item-manager", query: query });
} else {
vm.$message({
type: "warning",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
});
},
//切换tabs
handleClickTabs(tab, event) {
if (tab.name == "second") {
vm.setRegion();
}
},
// 模板列表选中
checkFn(id) {
vm.canNext = true;
vm.openTemplateId = id;
},
//选中自定义课程后点击下一步时检测(机构和进行中的项目)
checkSelectCustomCourse() {
openLoading(vm);
vm.GET(`portal/portalCustom/checkBeforeCreateCustomProject`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.maxLimitCreatedCustomProjectCountInYear =
res.data.maxLimitCreatedCustomProjectCountInYear;
vm.active = 1;
return;
} else {
if(res.data.status == 21) {
vm.statusObj.status_21.message = `本年度免费创建自定义项目数已达${res.data.maxLimitCreatedCustomProjectCountInYear}次，不能继续创建`;
}
vm.dialogObj = Object.assign(vm.dialogObj, vm.statusObj[`status_${res.data.status}`]);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
//选中模板后点击下一步时检测(机构和进行中的项目)
checkSelectTemplate() {
openLoading(vm);
vm.GET(
`portal/openTemplateProject/checkAfterSelectOneOpenTemplate/${vm.openTemplateId}`
)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.active = 1;
return;
} else {
vm.dialogObj = Object.assign(
vm.dialogObj,
vm.statusObj[`status_${res.data.status}`]
);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
// 隐藏弹框
hide() {
vm.dialogObj.visible = false;
},
// 获取行政范围
setRegion() {
vm.getOrganizationList(vm.$refs.selectRegion.getScope());
},
// 查询行政范围的设定机构列表
getOrganizationList(r) {
vm.$refs.setOrganization.init();
vm.$refs.setOrganization.getOrganization(r);
},
// 返回选择模板页
backSelectVue() {
vm.active = 0;
},
// 是否隐藏暂存按钮
hideSave(num) {
this.projectStatus = num;
},
// 从子组件（项目信息）获取项目状态是否为上架
setStatus4Flag(s) {
vm.status4Flag = s;
}
}
};
</script>
<style lang="scss">
.edit-custom-wrap {
::-webkit-scrollbar
{
width: 16px;
height: 16px;
background-color: #F5F5F5;
}
/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #555;
}
.el-step.is-simple:not(:last-of-type) .el-step__title {
max-width: 100%;
}
.top-lin {
position: fixed;
height: 30px;
background: #f0f2f5;
right: 30px;
left: 285px;
z-index: 1001;
top: 125px;
}
.step-content-new {
min-width: 1300px;
background: #fff;
// z-index: 1001;
background: #fff;
// position: fixed;
// right: 30px;
// left: 285px;
overflow: hidden;
// height: 60px;
height: 54px;
line-height: 54px;
// margin-top: 66px;
padding: 15px 0 50px 0;
border-bottom: 1px solid #efefef;
// margin-bottom: 20px;
background: #fff;
.is-text {
display: none;
}
.el-steps--simple {
background: #fff;
}
.button-green {
color: #ffffff;
background: #449284;
border-color: #bfdad5;
border-radius: 2px;
}
.button-white {
color: #606266;
background: #ffffff;
border-color: #ecedf1;
border-radius: 2px;
}
.step-num {
display: block;
// margin-top: 1.5px;
font-size: 12px;
border: 1px solid #999 !important;
border-radius: 50%;
width: 25px;
height: 18px;
line-height: 16px;
text-align: center;
color: #999;
}
.el-step__title.is-wait {
color: #999;
}
.el-step__title.is-process {
color: #449284;
}
.is-finish {
color: #999 !important;
}
.on-step {
color: #449284;
border: 1px solid #449284 !important;
}
.dis-btn {
width: 78px;
height: 34px;
background: rgba(240, 242, 245, 1);
border-radius: 3px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(144, 147, 153, 1);
line-height: 34px;
text-align: center;
cursor: pointer;
}
.dis-btn-b {
position: relative;
left: 5px;
bottom: 10px;
}
}
.add-content {
background: #fff;
}
.three-step {
padding-top: 64px;
margin: 10px 0 0 20px;
.area-p {
margin-bottom: 15px;
font-size: 14px;
}
.span_ecology {
line-height: 45px;
margin-left: 8px;
}
.dialog-p {
text-align: center;
span {
color: #449284;
}
}
//隐藏树展开
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
.el-tree-node__expand-icon {
display: none;
}
.department {
margin-top: 20px;
border: 1px solid #dddddd;
}
.el-tabs__nav-wrap::after {
display: none;
}
.el-tabs__active-bar {
display: none;
}
#tab-first,
#tab-second,
#tab-third {
padding-right: 0px;
}
#tab-first::after {
color: #c7cbd2;
margin-left: 20px;
content: "•";
}
.el-tabs__item.is-active {
color: #fff;
}
.el-tag {
margin: 0 10px 10px 0;
border: 1.3px solid #48a8fe;
color: #1e92fe;
background-color: #e7f6fe;
.el-icon-close {
width: 13px;
height: 13px;
line-height: 13px;
font-size: 12px;
background-color: #0486fe;
border-radius: 50%;
color: #d4edfe;
}
}
.down-button {
margin-left: 10px;
}
.down-button-close {
margin-left: 100px;
float: left;
}
.dialog-success {
p {
text-align: center;
.upload-text {
color: #449284;
}
}
}
.dialog-fail {
.fail-type {
p {
margin-top: 10px;
}
.fail-num {
color: #db3f52;
}
.fail-notice {
color: #e3e3e3;
font-size: 13px;
}
.fail-link {
text-align: center;
color: #449284;
cursor: pointer;
}
}
}
}
.tpl-main {
// padding-top: 64px;
}
}
</style>
src/views/education/edit-custom copy.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="template-open-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="add-content screenSet" id="screenSet">
<div class="top-lin"></div>
<el-row class="step-content">
<el-col :span="14">
<el-steps :active="active" simple class>
<span class="step-num" v-bind:class="{ 'on-step': active==0 }">1</span>
<el-step title="选择项目模板">1</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==1 }">2</span>
<el-step title="填写项目信息">2</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==2 }">3</span>
<el-step title="选择学员范围">3</el-step>
</el-steps>
</el-col>
<el-col :span="5" :offset="5">
<div v-if="!canNext" class="dis-btn">下一步</div>
<el-button v-if="active!=0 && projectStatus==1" size="small" @click="save">暂存</el-button>
<el-button v-if="active!==2 && canNext" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="active==2" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<!-- 模板列表 -->
<div v-if="active == 0" class="tpl-main">
<template-list @checkFn="checkFn"></template-list>
</div>
<!-- 填写项目信息-->
<template-message
ref="templateMessage"
v-if="active == 1"
:openTemplateId="openTemplateId"
:projectId="projectId"
:editor="editor"
@next="next"
@backSelectVue="backSelectVue"
@hideSave="hideSave"
@setStatus4Flag="setStatus4Flag"
/>
<!-- 选择学员 -->
<div class="three-step" v-if="active === 2">
<el-tabs v-model="activeName" @tab-click="handleClickTabs">
<el-tab-pane label="设定行政范围" name="first">
<select-region ref="selectRegion" :projectId="projectId" :status4Flag="status4Flag"></select-region>
</el-tab-pane>
<el-tab-pane label="设定机构" name="second">
<set-organization ref="setOrganization" :projectId="projectId" :status4Flag="status4Flag"></set-organization>
</el-tab-pane>
</el-tabs>
</div>
</div>
<dialog-componet :dialogObj="dialogObj" @hide="hide"></dialog-componet>
<dialog-componet :dialogObj="sendObj" @hide="hidefn" @confirm="confirmFn"></dialog-componet>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import templateMessage from "../../components/education/template/templateMessage";
import selectTemplate from "../../components/education/template/selectTemplate";
import selectRegion from "../../components/education/template/selectRegion";
import setOrganization from "../../components/education/template/setOrganization";
import templateList from "../../components/education/template/templateList";
import dialog from "../../components/education/template/dialog";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
let vm = null;
export default {
data() {
return {
curmbFirst: "教培项目",
curmbSecond: "项目管理",
jumPathThird: 'item-manager',
curmbThird: '发起项目',
active: 0,
formTemplate: {
component: [],
configure: 2,
certificate: ""
},
activeName: "first",
canNext: false,
openTemplateId: 0, // 开放模板ID
projectId: '', // 项目id
status: 10, // 0正常10没有加入机构11审核中12审核失败20存在进行中项目21数量已达上限
editor: false, // 是否为编辑状态
dialogObj: {
visible: false,
title: '',
message: '',
tip: '',
hideMsg: ''
},
statusObj: {
status_10: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后，可创建项目',
tip: '（如为新创建机构，请等待机构审核通过）',
hideMsg: '我知道了'
},
status_11: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后，可创建项目',
tip: '（如为新创建机构，请等待机构审核通过）',
hideMsg: '我知道了'
},
status_12: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后，可创建项目',
tip: '（如为新创建机构，请等待机构审核通过）',
hideMsg: '我知道了'
},
status_20: {
title: '该项目正在进行中',
message: '不能重复创建,请选择其他模版或者下架正在进行中的项目',
hideMsg: '确定'
},
status_21: {
title: '该项目创建数量已上限',
message: '本年度免费创建数已达4次,不能继续创建该项目',
hideMsg: '确定'
}
},
sendObj: { // 发布
visible: false,
title: '确定发布吗?',
message: '发布后,项目将进入审核中,待审核完成后学员可在云鹊医App上参加培训学习',
tip: '',
confirmMsg: '取消',
hideMsg: '确定发布'
},
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
status4Flag: 0,//0表示没有上过架，1表示上过架
isPreview: 0 // 1表示是查看信息
}
},
components: {
BreadCrumb,
templateMessage,
selectTemplate,
selectRegion,
setOrganization,
templateList,
dialogComponet:dialog
},
created() {
vm = this;
vm.isEditorFn();
vm.isPreviewFn();
},
mounted() {
commonUtil.resizeHeight();
},
methods: {
// 判断是否为编辑状态
isEditorFn(){
if(vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.editor = true;
vm.active = 1;
vm.canNext = true;
}
},
isPreviewFn() {
if(vm.$route.query.isPreview == 1 && vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.isPreview = vm.$route.query.isPreview;
vm.active = 1;
vm.canNext = true;
}
},
// 按钮点击下一步
nextStep() {
if (vm.active == 0) {
vm.checkSelectTemplate()
return;
}
if (vm.active == 1) {
// 查看时，点击下一步直接跳
if (vm.isPreview == 1) {
vm.active = 2;
return;
}
// 调用项目信息中的下一步操作
vm.$refs.templateMessage.nextStep();
return;
}
},
// 填写项目信息组件的下一步回调（获取项目id）
next(id) {
vm.projectId = id;
vm.active = 2;
},
// 暂存
save() {
if (vm.active == 1) {
vm.$refs.templateMessage.save();
} else if (vm.active == 2) {
vm.regionComplete();
}
},
confirmFn() {
vm.sendObj.visible = false;
},
// 完成
complete() {
// 4不弹框
if (vm.projectStatus !=4 && vm.isPreview != 1) {
vm.sendObj.visible = true;
} else {
// 查看时,点击完成直接跳到列表页
if (vm.isPreview == 1) {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "item-manager", query: query });
return;
}
vm.hidefn();
}
},
// 完成触发的接口
hidefn() {
vm.regionComplete(vm.changeStatus);
},
// 选择学元范围暂存
regionComplete(fishFn) {
let req = {
projectId: vm.projectId,
scopeOfAdministrative: vm.$refs.selectRegion.setScope(),
scopeOfDepartment: 99999999,
flag: fishFn ? 3 : 1, //0：下一步 1：暂存
};
openLoading(vm);
vm.POST("portal/new/scope", req)
.then(res => {
closeLoading(vm);
if(res.code == '000000' && fishFn) {
fishFn();
}
if (!fishFn) {
vm.$message({
type: "info",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
})
},
// 完成后更改状态
changeStatus() {
let req = {
projectId: vm.projectId,
changeStatus: 3 //待审核
};
vm.POST("portal/portalInfo/changeStatus", req)
.then(res => {
vm.sendObj.visible = false;
if(res.code == '000000') {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "item-manager", query: query });
} else {
vm.$message({
type: "warning",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
})
},
//切换tabs
handleClickTabs(tab, event) {
if (tab.name == 'second') {
vm.setRegion();
}
},
// 模板列表选中
checkFn(id) {
vm.canNext = true;
vm.openTemplateId = id;
},
//选中模板后点击下一步时检测(机构和进行中的项目)
checkSelectTemplate() {
openLoading(vm);
vm.GET(`portal/openTemplateProject/checkAfterSelectOneOpenTemplate/${vm.openTemplateId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.active = 1;
return;
} else {
vm.dialogObj = Object.assign(vm.dialogObj, vm.statusObj[`status_${res.data.status}`]);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 隐藏弹框
hide() {
vm.dialogObj.visible = false;
},
// 获取行政范围
setRegion() {
vm.getOrganizationList(vm.$refs.selectRegion.getScope());
},
// 查询行政范围的设定机构列表
getOrganizationList(r) {
vm.$refs.setOrganization.init();
vm.$refs.setOrganization.getOrganization(r);
},
// 返回选择模板页
backSelectVue() {
vm.active = 0;
},
// 是否隐藏暂存按钮
hideSave(num) {
this.projectStatus = num;
},
// 从子组件（项目信息）获取项目状态是否为上架
setStatus4Flag(s) {
vm.status4Flag = s;
}
}
}
</script>
<style lang="scss">
.template-open-wrap {
.el-step.is-simple:not(:last-of-type) .el-step__title {
max-width: 100%;
}
.top-lin {
position: fixed;
height: 30px;
background: #F0F2F5;
right: 30px;
left: 285px;
z-index: 1001;
top: 125px;
}
.step-content {
background: #fff;
z-index: 1001;
background: #fff;
position: fixed;
right: 30px;
left: 285px;
overflow: hidden;
height: 60px;
// margin-top: 66px;
padding: 15px 0 50px 0;
border-bottom: 1px solid #efefef;
background: #fff;
.is-text {
display: none;
}
.el-steps--simple {
background: #fff;
}
.button-green {
color: #ffffff;
background: #449284;
border-color: #bfdad5;
border-radius: 2px;
}
.button-white {
color: #606266;
background: #ffffff;
border-color: #ecedf1;
border-radius: 2px;
}
.step-num {
display: block;
// margin-top: 1.5px;
font-size: 12px;
border: 1px solid #999 !important;
border-radius: 50%;
width: 25px;
height: 18px;
line-height: 16px;
text-align: center;
color: #999;
}
.el-step__title.is-wait {
color: #999;
}
.el-step__title.is-process {
color: #449284;
}
.is-finish {
color: #999 !important;
}
.on-step {
color: #449284;
border: 1px solid #449284 !important;
}
.dis-btn {
width:78px;
height:34px;
background:rgba(240,242,245,1);
border-radius:3px;
font-size:14px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(144,147,153,1);
line-height:34px;
text-align: center;
cursor: pointer;
}
}
.add-content {
background: #fff;
}
.three-step {
padding-top: 64px;
margin: 10px 0 0 20px;
.area-p {
margin-bottom: 15px;
font-size: 14px;
}
.span_ecology {
line-height: 45px;
margin-left: 8px;
}
.dialog-p {
text-align: center;
span {
color: #449284;
}
}
//隐藏树展开
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
.el-tree-node__expand-icon {
display: none;
}
.department {
margin-top: 20px;
border: 1px solid #dddddd;
}
.el-tabs__nav-wrap::after {
display: none;
}
.el-tabs__active-bar {
display: none;
}
#tab-first,
#tab-second,
#tab-third {
padding-right: 0px;
}
#tab-first::after {
color: #c7cbd2;
margin-left: 20px;
content: "•";
}
.el-tabs__item.is-active {
color: #fff;
}
.el-tag {
margin: 0 10px 10px 0;
border: 1.3px solid #48a8fe;
color: #1e92fe;
background-color: #e7f6fe;
.el-icon-close {
width: 13px;
height: 13px;
line-height: 13px;
font-size: 12px;
background-color: #0486fe;
border-radius: 50%;
color: #d4edfe;
}
}
.down-button {
margin-left: 10px;
}
.down-button-close {
margin-left: 100px;
float: left;
}
.dialog-success {
p {
text-align: center;
.upload-text{
color: #449284;
}
}
}
.dialog-fail {
.fail-type {
p {
margin-top: 10px;
}
.fail-num {
color: #db3f52;
}
.fail-notice {
color: #e3e3e3;
font-size: 13px;
}
.fail-link {
text-align: center;
color: #449284;
cursor: pointer;
}
}
}
}
.tpl-main {
padding-top: 60px;
}
}
</style>
src/views/education/edit-manager.old.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
因为 它太大了无法显示 源差异 。您可以改为 查看blob。
src/views/education/edit-notice copy.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="notice-item-shield">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="header-title" style="position:relative;">
公告
<el-button
type="primary"
style="position: absolute;right: 30px;bottom: 8px;"
size="small"
@click="beforeConfirm()"
>发布</el-button>
<el-button
type="primary"
style="position: absolute;right: 100px;bottom: 8px;"
size="small"
@click="cancleEdit()"
>取消</el-button>
</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form :model="formData" ref="formData" :rules="rules" label-width="120px" class="form-inline">
<el-form-item label="是否开启公告：" prop="projectIntro" style="min-width: 1000px;margin-bottom: 10px">
<el-col :span="20">
<el-radio-group size="small" v-model="formData.openFlag">
<el-radio :label="1">开启</el-radio>
<el-radio :label="2">关闭</el-radio>
</el-radio-group>
</el-col>
</el-form-item>
<!-- <el-col :span="22" style="min-width: 600px;">
<el-form-item label="是否开启公告：">
<el-radio-group size="small" v-model="formData.openFlag" @change="changeOpenFlag">
<el-radio :label="1">开启</el-radio>
<el-radio :label="2">关闭</el-radio>
</el-radio-group>
</el-form-item>
</el-col> -->
<el-form-item v-show="formData.openFlag != 2" label="标题：" prop="noticeTitle">
<el-col :span="20">
<el-input size="small" v-model="formData.noticeTitle" placeholder="请输入公告标题" maxlength=20></el-input>
<span class="word-num">{{(formData.noticeTitle).replace(/\s+/g,"").length}}/20</span>
</el-col>
</el-form-item>
<!-- <el-col v-show="formData.openFlag != 2" :span="20">
<el-form-item label="标题：" prop="noticeTitle">
<el-input size="small" v-model="formData.noticeTitle" placeholder="请输入公告标题" maxlength=20></el-input>
<span class="word-num">{{(formData.noticeTitle).replace(/\s+/g,"").length}}/20</span>
</el-form-item>
</el-col> -->
<el-form-item v-show="formData.openFlag != 2" label="内容：" prop="noticeContent">
<el-col :span="20">
<el-input size="small" v-model="formData.noticeContent" placeholder="请输入公告内容" type="textarea"
:autosize="{ minRows: 5}" maxlength=150></el-input>
<span class="word-num">{{(formData.noticeContent).replace(/\s+/g,"").length}}/150</span>
</el-col>
</el-form-item>
<!-- <el-col v-show="formData.openFlag != 2" :span="20">
<el-form-item label="内容：" prop="noticeContent">
<el-input size="small" v-model="formData.noticeContent" placeholder="请输入公告内容" maxlength=150></el-input>
<span class="word-num">{{(formData.noticeContent).replace(/\s+/g,"").length}}/150</span>
</el-form-item>
</el-col> -->
</el-form>
</el-row>
</div>
<el-dialog
class="prot-dialog"
title=""
:visible.sync="isShowDialog"
width="30%"
center
:close-on-click-modal=false
:close-on-press-escape=false
:show-close=false>
<p v-show="isCancleBtn" class="prot-dialog-tips-1">确定取消吗？取消后将不保存本次操作内容</p>
<p v-show="!isCancleBtn" class="prot-dialog-tips-1">点击发布后将立即生效，是否继续发布？</p>
<!-- <p class="prot-dialog-tips-2">若您选择暂不发送，您只能录入量表的非敏感信息</p> -->
<!-- <p class="prot-dialog-tips-3">为避免打扰居民，7天内只能发送1次，您已发送过短信，请尽快联系居民同意授权</p> -->
<span v-show="isCancleBtn" slot="footer" class="dialog-footer">
<el-button size="small" @click="cancleConfirm"> 确定取消 </el-button>
<el-button size="small" type="primary" @click="isShowDialog = false"> 继续操作 </el-button>
</span>
<span v-show="!isCancleBtn" slot="footer" class="dialog-footer">
<el-button size="small" @click="openFlagCancle"> 取消 </el-button>
<el-button size="small" type="primary" @click="openFlagConfirm"> 确定 </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation";
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
// let checkNoticeTitleStr = (rule, value, callback) => {
// if(value.indexOf("\\") != -1) {//存在
// callback(new Error('请勿输入字符“ \\ ”'));
// } else if (value.indexOf(".") != -1) {
// callback(new Error('请勿输入字符“ . ”'));
// } else {
// callback();
// }
// };
return {
curmbFirst: "教培项目",
curmbSecond: "公告管理",
projectId: "",
formData: {
noticeContent: "",
noticeId: 0,
noticeTitle: "",
openFlag: 0,
projectId: 0
},
isShowDialog: false,
isCancleBtn: true,
rules: {
noticeTitle: [
{ required: true, message: "请输入公告标题", trigger: "blur" },
{
min: 2,
max: 20,
message: "输入长度为2-20的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
// { validator: checkNoticeTitleStr, trigger: 'blur' }
],
noticeContent: [
{ required: true, message: "请输入公告内容", trigger: "blur" },
{
min: 2,
max: 150,
message: "输入长度为2-150的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
],
}
};
},
created() {
vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "projectId");
vm.formData.projectId = vm.projectId
vm.getNoticeInfo();
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
//获取公告信息
getNoticeInfo() {
let req = {
projectId: vm.projectId
};
openLoading(vm);
vm.GET("portal/noticeInfo/getNoticeInfo", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.formData = res.data;
}
});
},
beforeConfirm() {
let flag = false;
vm.$refs['formData'].validate(valid => {
if (valid) {
flag = true;
} else {
flag = false;
}
});
if(!flag) return;
vm.isCancleBtn = false;
// if(vm.formData.noticeId) {
vm.isShowDialog = true;
// }
},
//提交公告信息
confirmEdit(needJump) {
openLoading(vm);
vm.formData.projectId = vm.projectId
vm.POST("portal/noticeInfo/insertOrUpdate", vm.formData).then(res => {
closeLoading(vm);
if (res.code == "000000") {
// if(needJump) {
vm.$router.push('/item-manager');
vm.$message.success('发布成功');
// }
}
});
},
// 点击取消按钮
cancleEdit() {
vm.isCancleBtn = true;
vm.isShowDialog = true;
},
// 切换开启状态
changeOpenFlag(value) {
if(vm.formData.noticeId && value == 1) {
vm.isCancleBtn = false;
vm.isShowDialog = true;
}
},
// 确认取消
cancleConfirm() {
vm.isShowDialog = false;
vm.$router.push('/item-manager');
},
// 确认开启的取消
openFlagCancle() {
vm.isShowDialog = false;
// vm.formData.openFlag = 2;
// vm.$forceUpdate();
},
// 确认开启
openFlagConfirm() {
vm.isShowDialog = false;
vm.confirmEdit();
}
}
};
</script>
<style lang="scss">
.notice-item-shield {
.component-content {
background: #fff;
padding: 20px 30px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.complete {
float: right;
}
.text-black {
color: #d51f35;
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.el-input {
width: 80%;
}
.el-textarea {
width: 80%;
}
.el-form-item__error {
left: 13px;
}
}
</style>
\ No newline at end of file
src/views/education/item-component.old.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="item-component-wrap">
<bread-crumb
:curmbFirst="curmbFirst"
:curmbSecond="curmbSecond">
</bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="search-title">查询条件</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="serchForm" :model="searchParam" label-width="75px" style="width:100%;">
<el-col :span="6">
<el-form-item label="组件名称:">
<el-input v-model="searchParam.name" size="small" placeholder="请输入组件名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="发布状态:">
<el-select v-model="searchParam.status" size="small" style="width: 100%;" placeholder="请选择发布状态">
<el-option
v-for="(item,index) in statuSelect"
:key="index"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="search(1)">查询</el-button>
<el-button type="default" size="small" @click="reseat" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
<el-row :gutter="10" class="row create-button" style="margin-right:0;">
<el-button type="primary" size="small" :disabled="idType == 2 && masterAdministratorFlag == 'false'" @click="createComponent">新建项目组件</el-button>
</el-row>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column prop="id" label="ID编号" min-width="100" align="center"></el-table-column>
<el-table-column prop="name" label="组件名称" min-width="200" align="center"></el-table-column>
<el-table-column prop="createdName" label="发起人" min-width="100" align="center"></el-table-column>
<el-table-column prop="status" label="状态" min-width="80" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status | statusFileter }}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="editComponentList(scope.row)">编辑</el-button>
<el-button type="primary" v-if="scope.row.status == 2 || scope.row.status == 4" size="small" @click="enableAndDisable(scope.row,1)">启用</el-button>
<el-button type="primary" v-if="scope.row.status == 3" size="small" @click="enableAndDisable(scope.row,2)">禁用</el-button>
<el-button type="primary" v-if="scope.row.status == 1 || scope.row.status == 2" size="small" @click="deleteComponent(scope.row)">删除</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from '../../components/breadcrumb.vue'
import { doUpload, getFilePath } from "../../utils/qiniu-util"
import { validateWord } from "../../utils/validate.js"
import { mapGetters,mapActions } from 'vuex'
import { openLoading, closeLoading } from '../../utils/utils'
import * as commonUtil from '../../utils/utils'
let vm = null
export default {
components: {
BreadCrumb
},
data() {
return {
curmbFirst: '教培项目',
curmbSecond: '项目组件',
idType:'',
masterAdministratorFlag: false,
searchParam: {
idType: '',
name: '',
status: '',
pageNo: 1,
pageSize: 15
},
statuSelect: [
{
label: '草稿',
value: '1'
},{
label: '未启用',
value: '2'
},{
label: '已启用',
value: '3'
},{
label: '已禁用',
value: '4'
}
],
tableData: [],
totalRows: 0,
basicRule: {
"name": [
{ required: true, message: '输入长度为2-20个中文', trigger: 'blur' },
{ validator: function(rule, value, callback) {
validateWord(rule, value, callback, '输入长度为2-20个中文')
},
trigger: 'blur' }
],
"introduce": [
{ required: true, message: '请输入组件简介', trigger: 'blur' },
],
}
}
},
computed: {
...mapGetters([
'_token',
// 'idType',
// 'masterAdministratorFlag'
])
},
created() {
vm = this
vm.idType = localStorage.getItem('storageIdType')
vm.masterAdministratorFlag = localStorage.getItem('storageMaster')
if(this.$route.query.pageNum){
console.log(this.$store.state.common.itemComponents)
vm.searchParam.status = this.$store.state.common.itemComponents.status
vm.searchParam.name = this.$store.state.common.itemComponents.name
vm.searchParam.pageNo = parseInt(this.$route.query.pageNum)
}
vm.search()
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight()
},
methods: {
...mapActions([
'updateItemComponents'
]),
// 列表查询
search(flag) {
if(flag) vm.searchParam.pageNo = 1
vm.searchParam.idType = vm.idType
openLoading(vm)
vm.GET('portal/portalComponent/queryPortalComponent',vm.searchParam).then((res) => {
closeLoading(vm)
if( res.code == '000000' ) {
vm.tableData = res.data.queryList
vm.totalRows = res.data.total
}else {
vm.$message.info(res.message)
}
})
},
// 重置
reseat() {
vm.searchParam = Object.assign({},{
idType: '',
name: '',
status: '',
pageNo: 1,
pageSize: 15
})
vm.search()
},
// 新建组件
createComponent() {
vm.$router.push({path: 'create-component'})
},
// 编辑(验证可编辑范围)
editComponentList(row) {
let req = {
token: vm._token,
componentId: row.id
}
vm.GET('portal/portalComponent/componentEditRange',req).then((res) => {
if(res.code == "000000") {
vm.updateItemComponents({name:vm.searchParam.name,status:vm.searchParam.status})
vm.$router.push({path: 'create-component',query: {id:row.id,status: row.status,resultFlag: res.data.resultFlag,pageNum:vm.searchParam.pageNo}})
}else {
vm.$message.info(res.message)
}
})
},
// 启用(禁用)
enableAndDisable(row,flag) {
let req = null
let text = ''
if(flag == 1) { // 启用
req = {
id: row.id,
status: 3
}
text = '组件一经启用，将无法进行修改，确定启用吗？'
}else if(flag == 2) { // 禁用
req = {
id: row.id,
status: 4
}
text = '确定禁用吗？'
}
vm.$confirm(text, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vm.GET('portal/portalComponent/disableOrStart',req).then((res) => {
if(res.code == "000000") {
vm.$message({
type: 'success',
message: '操作成功!'
});
vm.search()
if(res.message != 'success') {
vm.$message({
message: res.message,
type: 'warning'
})
}
}else {
vm.$message.info(res.message)
}
}).catch(function (error) {
vm.$message.error(error);
});
}).catch(() => {
vm.$message({
type: 'info',
message: '已取消'
});
});
},
// 删除
deleteComponent(row) {
vm.$confirm('确定要删除该组件吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vm.GET('portal/portalComponent/deleteComponentById',{id: row.id}).then((res) => {
if(res.code == "000000") {
vm.$message({
type: 'success',
message: '删除成功!'
});
vm.search()
} else {
vm.$message.info(res.message)
}
}).catch(function (error) {
vm.$message.error(error);
});
}).catch(() => {
vm.$message({
type: 'info',
message: '已取消'
})
})
},
handleSizeChange(value) {
vm.searchParam.pageSize = value
vm.search()
},
handleCurrentChange(value) {
vm.searchParam.pageNo = value
vm.search()
}
}
}
</script>
<style lang="scss">
.item-component-wrap {
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
.search-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
img{
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
</style>
src/views/education/item-manager copy.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="item-manager-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="header-title">项目管理</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-col :span="5">
<el-form-item label="项目名称：">
<el-input v-model="formInline.projectName" size="small" placeholder="请输入项目名称"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span="8">
<el-form-item label="项目时间：">
<el-date-picker
v-model="formInline.duringTime"
size="small"
type="daterange"
start-placeholder="请选择开始时间"
end-placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
></el-date-picker>
</el-form-item>
</el-col>-->
<el-col :span="6">
<el-form-item label="项目时间：">
<el-date-picker
v-model="formInline.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions0"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="~">
<el-date-picker
v-model="formInline.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="23:59:59"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="searchList">查询</el-button>
<el-button type="default" size="small" @click="resetForm" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
<el-row>
<el-col :span="5">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-form-item label="发布状态：">
<el-select size="small" v-model="formInline.projectStatus" placeholder="请选择发布状态">
<el-option
v-for="item in optionStatus"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-form :model="formInline" class="demo-form-inline">
<el-form-item>
<el-button class="add-button" :disabled="idType == 2 && masterAdministratorFlag == 'false'" size="small" type="primary" @click="openProject()">新建项目</el-button>
</el-form-item>
</el-form>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="id" label="ID编号" min-width="100" align="center"></el-table-column>
<el-table-column prop="projectName" label="项目名称" min-width="100" align="center"></el-table-column>
<el-table-column prop="createdName" label="创建人" align="center"></el-table-column>
<el-table-column prop="projectLeader" label="项目负责人" align="center"></el-table-column>
<el-table-column prop="projectTypeValue" label="项目类型" align="center"></el-table-column>
<el-table-column prop="createdTime" label="创建时间" width="100" align="center"></el-table-column>
<!-- <el-table-column
prop="projectIntro"
label="项目简介"
align="center"
min-width="100"
show-overflow-tooltip
></el-table-column> -->
<el-table-column prop="projectBegintime" label="项目开始时间" min-width="90" align="center"></el-table-column>
<el-table-column prop="projectEndtime" label="项目结束时间" min-width="90" align="center"></el-table-column>
<el-table-column prop="projectStatus" label="状态" align="center">
<template slot-scope="scope">
<span>{{ [scope.row.projectStatus , idType] | statusProject }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" min-width="360" align="center">
<template slot-scope="scope">
<el-button
@click="changeStatus(scope.row,0)"
v-show="showButton(scope.row,0)"
type="primary"
size="small"
>编辑</el-button>
<el-button
@click="changeStatus(scope.row,1)"
v-show="showButton(scope.row,1)"
type="primary"
size="small"
>暂存</el-button>
<el-button
@click="changeStatus(scope.row,2)"
v-show="showButton(scope.row,2)"
type="primary"
size="small"
>完成</el-button>
<el-button
@click="changeStatus(scope.row,3)"
v-show="showButton(scope.row,3)"
type="primary"
size="small"
>发布</el-button>
<el-button
@click="changeStatus(scope.row,4)"
v-show="showButton(scope.row,4)"
type="primary"
size="small"
>通过</el-button>
<el-button
@click="changeStatus(scope.row,5)"
v-show="showButton(scope.row,5)"
type="primary"
size="small"
>下架</el-button>
<el-button
@click="changeStatus(scope.row,7)"
v-show="showButton(scope.row,7)"
type="primary"
size="small"
:disabled="scope.row.checkStatus==1"
>提醒审核</el-button>
<el-button
@click="changeStatus(scope.row,8)"
v-show="showButton(scope.row,8)"
type="primary"
size="small"
>取消审核</el-button>
<el-button
@click="changeStatus(scope.row,6)"
v-show="showButton(scope.row,6)"
type="primary"
size="small"
>拒绝</el-button>
<el-button
@click="delItem(scope.row,9)"
v-show="showButton(scope.row,9)"
type="primary"
size="small"
>删除</el-button>
<el-button
@click="hanldeCmeClick(scope.row)"
v-show="showCMEButton(scope.row)"
type="primary"
size="small"
>{{ handleCmeOperate(scope.row.projectStatus) }}</el-button>
<el-button
@click="toShield(scope.row)"
v-show="scope.row.blackModifiable == true"
type="primary"
size="small"
>屏蔽</el-button>
<el-button
@click="addOrModifyNotice(scope.row, 0)"
v-if="masterAdministratorFlag == 'true'"
type="primary"
size="small"
>公告</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formInline.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="formInline.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
<!-- 初审 弹窗 -->
<el-dialog
title="项目初审"
:visible.sync="firstCheckVisible"
width="600px"
:close-on-click-modal="false"
center>
<span style="margin: 0 20px;">{{ `项目《${currentRow.projectName}》初审结果为？` }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCheckLeft">通 过</el-button>
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
<!-- 新建项目弹窗 -->
<el-dialog
title="请选择项目类型"
:visible.sync="centerDialogVisible"
width="600px"
:close-on-click-modal="false"
@close="handleTypeClose"
center>
<span style="margin: 0 20px;">项目类型：</span>
<el-radio-group v-model="newProjectType">
<el-radio :label="1">普通项目</el-radio>
<el-radio :label="2">CME项目</el-radio>
<el-radio :label="3">开放模板</el-radio>
</el-radio-group>
<span slot="footer" class="dialog-footer">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="handleCreateProject">确 定</el-button>
</span>
</el-dialog>
<!-- 复审 弹窗 -->
<el-dialog
title="项目复审"
:visible.sync="secondCheckVisible"
width="600px"
:close-on-click-modal="false"
center>
<span style="margin: 0 20px;">{{ `项目《${currentRow.projectName}》复审结果为？` }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCheckLeft">通 过</el-button>
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
<!-- 删除 弹窗 -->
<el-dialog
title="确认删除"
:show-close=false
:visible.sync="deleteVisible"
:close-on-click-modal="false"
width="600px"
center>
<p style="text-align: center;">删除后将不可撤销，确认删除吗？</p>
<span slot="footer" class="dialog-footer">
<el-button @click="confirmDelete">删 除</el-button>
<el-button type="primary" @click="hideDeleteFrom">取 消</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { create } from "domain";
import { mapGetters,mapActions } from 'vuex'
import { returnData } from "../../utils/mock";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import { setTimeout } from 'timers';
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
return {
idValue: '',
curmbFirst: "教培项目",
curmbSecond: "项目管理",
centerDialogVisible: false, // 新建项目弹窗
firstCheckVisible: false, // 各种操作的确认弹窗
secondCheckVisible: false,
newProjectType: 1, // 1 普通项目 2 CME项目
searchParam: {
name: "",
status: "",
pageNo: 1,
pageSize: 10
},
cmeBtnText: '',
currentRow: {},
optionStatus: [
{
value: 1,
label: "草稿"
},
{
value: 2,
label: "未上架"
},
{
value: 3,
label: "审核中/待审核"
},
{
value: 4,
label: "已上架"
},
{
value: 5,
label: "已下架"
},
{
value: 6,
label: "已拒绝/未上架"
},
{
value: 7,
label: "待初审"
},
{
value: 8,
label: "初审未通过"
},
{
value: 9,
label: "待复审"
},
{
value: 10,
label: "复审未通过"
},
{
value: 11,
label: "复审通过"
},
// 加上去 。。。。。。。CME
],
tableData: [],
totalRows: 0,
loading: true,
timingTime: "",
currentPage: 1,
formInline: {
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectStatus: "",
pageNo: 1,
pageSize: 10
},
pickerOptions0: {
disabledDate: time => {
if (this.formInline.projectEndtime != "" && this.formInline.projectEndtime !=null) {
return (
time.getTime() >
new Date(this.formInline.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
time.getTime() <
new Date(this.formInline.projectBegintime).getTime()
); //减去一天的时间代表可以选择同一天;
}
},
idType: '',
masterAdministratorFlag: false,
deleteVisible: false,
};
},
computed: {
...mapGetters([
"_token",
// "idType",
// "masterAdministratorFlag"
])
},
created() {
vm = this;
vm.idType = localStorage.getItem('storageIdType');
vm.masterAdministratorFlag = localStorage.getItem('storageMaster');
console.log('idType:',vm.idType);
if(this.$route.query.pageNum){
this.formInline = {...this.$store.state.common.itemManager}
this.formInline.pageNo = parseInt(this.$route.query.pageNum)
}
this.$nextTick(function() {;
this.getProjectList();
});
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
...mapActions([
'updateItemManager'
]),
hideDeleteFrom() {
this.deleteVisible = false;
},
openProject() {
if(vm.masterAdministratorFlag == 'true') {
this.centerDialogVisible = true;
} else {
this.toPage();
}
},
toPage() {
this.$router.push("edit-manager?projectType=1");
},
toCmePage() {
this.$router.push("edit-cme?projectType=2");
},
toTemplatePage() {
this.$router.push("template-open?projectType=3");
},
toShield(row) {
this.$router.push("item-shield?projectId="+row.id);
},
handleTypeClose() {
this.centerDialogVisible = false;
this.newProjectType = 1;
},
handleCreateProject() {
if (this.newProjectType == 1) { // 1 普通项目 2 CME项目
this.toPage();
} else if (this.newProjectType == 2) {
this.toCmePage();
} else if(this.newProjectType == 3) {
this.toTemplatePage();
}
},
hanldeCmeClick(row) {
this.currentRow = row;
let status = row.projectStatus;
// 7.待初审 8.初审未通过 9.待复审 10.复审未通过 11.复审通过
if (status == 7 || status == 8) { // 按钮显示 初审
this.firstCheckVisible = true;
} else if (status == 9 || status == 10) { // 按钮显示 复审
this.secondCheckVisible = true;
} else if (status == 11) { // 按钮显示 发布
this.changeStatus(row,3)
}
},
handleCheckLeft() { // 左边通过
this.goToCheckAuth(1);
},
handleCheckRight() {
this.goToCheckAuth(2);
},
goToCheckAuth(refuse) {
let row = this.currentRow;
let req = {};
openLoading(vm);
// refuse = 1 : 同意 refuse = 2：拒绝
vm.GET(`portal/cme/verifyProject?projectId=${row.id}&refuse=${refuse}`, req).then(res => {
closeLoading(vm);
// debugger;
vm.firstCheckVisible = false;
vm.secondCheckVisible = false;
if (res.code == "000000") {
vm.getProjectList();
this.$message({
message: '审核成功',
type: 'success'
});
} else {
this.$message.error(res.message);
}
});
},
searchList() {
this.formInline.pageNo = 1;
this.getProjectList();
},
//查询项目列表
getProjectList() {
let req = {};
req = this.formInline;
openLoading(vm);
vm.GET("portal/portalInfo/getProjectList", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.data;
//console.log(vm.tableData);
vm.totalRows = res.data.totalRows;
}
});
},
showCMEButton(row, type) {
// if(row.projectType == 2) {
// return true;
// } else {
// return false;
// }
// CME 专属状态码 为7~11，是这些代码的直接走新逻辑，别的走老逻辑
let cmeStatus = [7, 8, 9, 10, 11];
let currentStatus = parseInt(row.projectStatus);
if ( cmeStatus.indexOf(currentStatus) > -1 ) {
return true;
} else {
return false;
}
},
//按钮展示情况
showButton(row, type) {
// debugger;
// 按钮type类型： 0-编辑
// 1-暂存 2-完成 3-上架 4-通过 5-下架 6-拒绝
// 7- 提醒审核 8(2)-取消审核 9-删除
let projectStatus = row.projectStatus;
let idType = row.idType;
let level = row.level;
let flag = false;
let typeStr = parseInt(type);
//console.log("状态："+projectStatus+ "等级：" + level + " 按钮类型：" + type);
//console.log('idType',idType);
let buttonStatus = "";
if (idType == 1) {
//内部项目
buttonStatus = returnData().buttonStatusIn;
} else {
//外部项目
buttonStatus = returnData().buttonStatusOut;
}
if(projectStatus == null) {
return false;
}
if (level != null) {
let tempStatus = JSON.parse(JSON.stringify(projectStatus));
if (tempStatus > 6) {
tempStatus = 1;
}
let statusSet = buttonStatus[tempStatus - 1][level];
let flagValue = statusSet.indexOf(typeStr);
if (flagValue >= 0) {
flag = true;
} else {
flag = false;
}
}
//flag = true;
return flag;
},
handleCmeOperate(status) {
let text = '';
// 7.待初审 8.初审未通过 9.待复审 10.复审未通过 11.复审通过
if (status == 7 || status == 8) { // 按钮显示 初审
text = '初审';
} else if (status == 9 || status == 10) { // 按钮显示 复审
text = '复审';
} else if (status == 11) { // 按钮显示 发布
text = '发布';
}
this.cmeBtnText = text;
return text;
// return true / false;
},
//改变状态
changeStatus(row, type) {
let projectId = row.id;
let level = row.level;
if (type === 0) {
this.updateItemManager(this.formInline)
//编辑
if(row.projectType === 1) {
this.$router.push("edit-manager?projectType=1&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
} else if(row.projectType === 2) {
this.$router.push("edit-cme?projectType=2&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
}
} else if (type === 7) {
//提醒审核
let req = {
portalProjectId: projectId,
warnType: 1
};
vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
vm.$message.info(res.message);
vm.getProjectList();
if (res.code == "000000") {
console.log(res);
//vm.getProjectList();
}
});
} else {
// if (type === 8) {
// //取消审批值对应2
// type = 2;
// let req = {
// portalProjectId: projectId,
// warnType: 5
// };
// vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
// vm.$message.info(res.message);
// if (res.code == "000000") {
// console.log(res);
// vm.getProjectList();
// }
// });
// }
// if (type == 4 || type == 6) {
// //发送消息
// let warnType = "";
// if (type == 4) {
// warnType = 3;
// } else if (type == 6) {
// warnType = 4;
// }
// let req = {
// portalProjectId: projectId,
// warnType: warnType
// };
// vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
// vm.$message.info(res.message);
// if (res.code == "000000") {
// console.log(res);
// vm.getProjectList();
// }
// });
// }
let req = {
projectId: projectId,
changeStatus: vm.getType(type)
};
vm.POST("portal/portalInfo/changeStatus", req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
console.log(res);
vm.getProjectList();
//changeStatus之后remindPortalCheck
if (type == 4 || type == 6 || type == 8) {
//发送消息
let warnType = "";
if (type == 4) {
warnType = 3;
} else if (type == 6) {
warnType = 4;
} else if (type == 8) {
warnType = 5;
}
let req = {
portalProjectId: projectId,
warnType: warnType
};
vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
vm.getProjectList();
}
});
}
}
});
}
},
getType(value) {
let data = value;
if(data == 8) {
data = 2;
}
return data;
},
delItem(row) {
this.deleteVisible = true
this.currentRow = row;
},
hideDeleteFrom() {
this.deleteVisible = false;
},
// 删除项目
confirmDelete() {
let req = {};
vm.DELETE("portal/portalInfo/delete/" + this.currentRow.id, req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
this.deleteVisible = false;
vm.getProjectList();
}
});
},
// 重置表单
resetForm() {
vm.formInline = Object.assign(
{},
{
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectStatus: "",
pageNo: 1,
pageSize: 10,
duringTime: ""
}
);
vm.getProjectList();
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formInline.pageSize = val;
this.handleCurrentChange(this.searchParam.pageNo);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formInline.pageNo = val;
this.getProjectList();
//需要判断是否检索
// if (!this.flag) {
// this.currentChangePage(this.tableDataEnd);
// } else {
// this.currentChangePage(this.filterTableDataEnd);
// }
}, //组件自带监控当前页码
currentChangePage(list) {
let from = (this.currentPage - 1) * this.pageSize;
let to = this.currentPage * this.pageSize;
this.tableDataEnd = [];
for (; from < to; from++) {
if (list[from]) {
this.tableDataEnd.push(list[from]);
}
}
},
addOrModifyNotice(row) {
this.$router.push("edit-notice?projectId=" + row.id);
}
}
};
</script>
<style lang="scss">
.item-manager-wrap {
.component-content {
background: #fff;
//margin-top: 88px;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
// .table-option span {
// color: #409eff;
// }
.add-button {
float: right;
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
.el-tooltip__popper {
max-width:50%
}
</style>
src/views/education/item-manager.old.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="item-manager-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="header-title">项目管理</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-col :span="5">
<el-form-item label="项目名称：">
<el-input v-model="formInline.projectName" size="small" placeholder="请输入项目名称"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span="8">
<el-form-item label="项目时间：">
<el-date-picker
v-model="formInline.duringTime"
size="small"
type="daterange"
start-placeholder="请选择开始时间"
end-placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
></el-date-picker>
</el-form-item>
</el-col>-->
<el-col :span="6">
<el-form-item label="项目时间：">
<el-date-picker
v-model="formInline.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions0"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="~">
<el-date-picker
v-model="formInline.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="23:59:59"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="searchList">查询</el-button>
<el-button type="default" size="small" @click="resetForm" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
<el-row>
<el-col :span="5">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-form-item label="发布状态：">
<el-select size="small" v-model="formInline.projectStatus" placeholder="请选择发布状态">
<el-option
v-for="item in optionStatus"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-form :model="formInline" class="demo-form-inline">
<el-form-item>
<el-button class="add-button" :disabled="idType == 2 && masterAdministratorFlag == 'false'" size="small" type="primary" @click="openProject()">新建项目</el-button>
</el-form-item>
</el-form>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="id" label="ID编号" min-width="100" align="center"></el-table-column>
<el-table-column prop="projectName" label="项目名称" min-width="100" align="center"></el-table-column>
<el-table-column prop="createdName" label="创建人" align="center"></el-table-column>
<el-table-column prop="projectLeader" label="项目负责人" align="center"></el-table-column>
<el-table-column prop="projectTypeValue" label="项目类型" align="center"></el-table-column>
<el-table-column prop="createdTime" label="创建时间" width="100" align="center"></el-table-column>
<!-- <el-table-column
prop="projectIntro"
label="项目简介"
align="center"
min-width="100"
show-overflow-tooltip
></el-table-column> -->
<el-table-column prop="projectBegintime" label="项目开始时间" min-width="90" align="center"></el-table-column>
<el-table-column prop="projectEndtime" label="项目结束时间" min-width="90" align="center"></el-table-column>
<el-table-column prop="projectStatus" label="状态" align="center">
<template slot-scope="scope">
<span>{{ [scope.row.projectStatus , idType] | statusProject }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" min-width="360" align="center">
<template slot-scope="scope">
<el-button
@click="changeStatus(scope.row,0)"
v-show="showButton(scope.row,0)"
type="primary"
size="small"
>编辑</el-button>
<el-button
@click="changeStatus(scope.row,1)"
v-show="showButton(scope.row,1)"
type="primary"
size="small"
>暂存</el-button>
<el-button
@click="changeStatus(scope.row,2)"
v-show="showButton(scope.row,2)"
type="primary"
size="small"
>完成</el-button>
<el-button
@click="changeStatus(scope.row,3)"
v-show="showButton(scope.row,3)"
type="primary"
size="small"
>发布</el-button>
<el-button
@click="changeStatus(scope.row,4)"
v-show="showButton(scope.row,4)"
type="primary"
size="small"
>通过</el-button>
<el-button
@click="changeStatus(scope.row,5)"
v-show="showButton(scope.row,5)"
type="primary"
size="small"
>下架</el-button>
<el-button
@click="changeStatus(scope.row,7)"
v-show="showButton(scope.row,7)"
type="primary"
size="small"
:disabled="scope.row.checkStatus==1"
>提醒审核</el-button>
<el-button
@click="changeStatus(scope.row,8)"
v-show="showButton(scope.row,8)"
type="primary"
size="small"
>取消审核</el-button>
<el-button
@click="changeStatus(scope.row,6)"
v-show="showButton(scope.row,6)"
type="primary"
size="small"
>拒绝</el-button>
<el-button
@click="delItem(scope.row,9)"
v-show="showButton(scope.row,9)"
type="primary"
size="small"
>删除</el-button>
<el-button
@click="hanldeCmeClick(scope.row)"
v-show="showCMEButton(scope.row)"
type="primary"
size="small"
>{{ handleCmeOperate(scope.row.projectStatus) }}</el-button>
<el-button
@click="toShield(scope.row)"
v-show="scope.row.blackModifiable == true"
type="primary"
size="small"
>屏蔽</el-button>
<el-button
@click="addOrModifyNotice(scope.row, 0)"
v-if="masterAdministratorFlag == 'true'"
type="primary"
size="small"
>公告</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formInline.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="formInline.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
<!-- 初审 弹窗 -->
<el-dialog
title="项目初审"
:visible.sync="firstCheckVisible"
width="600px"
:close-on-click-modal="false"
center>
<span style="margin: 0 20px;">{{ `项目《${currentRow.projectName}》初审结果为？` }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCheckLeft">通 过</el-button>
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
<!-- 新建项目弹窗 -->
<el-dialog
title="请选择项目类型"
:visible.sync="centerDialogVisible"
width="600px"
:close-on-click-modal="false"
@close="handleTypeClose"
center>
<span style="margin: 0 20px;">项目类型：</span>
<el-radio-group v-model="newProjectType">
<el-radio :label="1">普通项目</el-radio>
<el-radio :label="2">CME项目</el-radio>
</el-radio-group>
<span slot="footer" class="dialog-footer">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="handleCreateProject">确 定</el-button>
</span>
</el-dialog>
<!-- 复审 弹窗 -->
<el-dialog
title="项目复审"
:visible.sync="secondCheckVisible"
width="600px"
:close-on-click-modal="false"
center>
<span style="margin: 0 20px;">{{ `项目《${currentRow.projectName}》复审结果为？` }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCheckLeft">通 过</el-button>
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { create } from "domain";
import { mapGetters,mapActions } from 'vuex'
import { returnData } from "../../utils/mock";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import { setTimeout } from 'timers';
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
return {
idValue: '',
curmbFirst: "教培项目",
curmbSecond: "项目管理",
centerDialogVisible: false, // 新建项目弹窗
firstCheckVisible: false, // 各种操作的确认弹窗
secondCheckVisible: false,
newProjectType: 1, // 1 普通项目 2 CME项目
searchParam: {
name: "",
status: "",
pageNo: 1,
pageSize: 10
},
cmeBtnText: '',
currentRow: {},
optionStatus: [
{
value: 1,
label: "草稿"
},
{
value: 2,
label: "未上架"
},
{
value: 3,
label: "审核中/待审核"
},
{
value: 4,
label: "已上架"
},
{
value: 5,
label: "已下架"
},
{
value: 6,
label: "已拒绝/未上架"
},
{
value: 7,
label: "待初审"
},
{
value: 8,
label: "初审未通过"
},
{
value: 9,
label: "待复审"
},
{
value: 10,
label: "复审未通过"
},
{
value: 11,
label: "复审通过"
},
// 加上去 。。。。。。。CME
],
tableData: [],
totalRows: 0,
loading: true,
timingTime: "",
currentPage: 1,
formInline: {
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectStatus: "",
pageNo: 1,
pageSize: 10
},
pickerOptions0: {
disabledDate: time => {
if (this.formInline.projectEndtime != "" && this.formInline.projectEndtime !=null) {
return (
time.getTime() >
new Date(this.formInline.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
time.getTime() <
new Date(this.formInline.projectBegintime).getTime()
); //减去一天的时间代表可以选择同一天;
}
},
idType: '',
masterAdministratorFlag: false
};
},
computed: {
...mapGetters([
"_token",
// "idType",
// "masterAdministratorFlag"
])
},
created() {
vm = this;
vm.idType = localStorage.getItem('storageIdType');
vm.masterAdministratorFlag = localStorage.getItem('storageMaster');
console.log('idType:',vm.idType);
if(this.$route.query.pageNum){
this.formInline = {...this.$store.state.common.itemManager}
this.formInline.pageNo = parseInt(this.$route.query.pageNum)
}
this.$nextTick(function() {;
this.getProjectList();
});
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
...mapActions([
'updateItemManager'
]),
openProject() {
if(vm.masterAdministratorFlag == 'true') {
this.centerDialogVisible = true;
} else {
this.toPage();
}
},
toPage() {
this.$router.push("edit-manager?projectType=1");
},
toCmePage() {
console.log('跳转至 cme 新建项目');
this.$router.push("edit-cme?projectType=2");
},
toShield(row) {
this.$router.push("item-shield?projectId="+row.id);
},
handleTypeClose() {
this.centerDialogVisible = false;
this.newProjectType = 1;
},
handleCreateProject() {
if (this.newProjectType == 1) { // 1 普通项目 2 CME项目
this.toPage();
} else if (this.newProjectType == 2) {
this.toCmePage();
}
},
hanldeCmeClick(row) {
this.currentRow = row;
let status = row.projectStatus;
// 7.待初审 8.初审未通过 9.待复审 10.复审未通过 11.复审通过
if (status == 7 || status == 8) { // 按钮显示 初审
this.firstCheckVisible = true;
} else if (status == 9 || status == 10) { // 按钮显示 复审
this.secondCheckVisible = true;
} else if (status == 11) { // 按钮显示 发布
this.changeStatus(row,3)
}
},
handleCheckLeft() { // 左边通过
this.goToCheckAuth(1);
},
handleCheckRight() {
this.goToCheckAuth(2);
},
goToCheckAuth(refuse) {
let row = this.currentRow;
let req = {};
openLoading(vm);
// refuse = 1 : 同意 refuse = 2：拒绝
vm.GET(`portal/cme/verifyProject?projectId=${row.id}&refuse=${refuse}`, req).then(res => {
closeLoading(vm);
// debugger;
vm.firstCheckVisible = false;
vm.secondCheckVisible = false;
if (res.code == "000000") {
vm.getProjectList();
this.$message({
message: '审核成功',
type: 'success'
});
} else {
this.$message.error(res.message);
}
});
},
searchList() {
this.formInline.pageNo = 1;
this.getProjectList();
},
//查询项目列表
getProjectList() {
let req = {};
req = this.formInline;
openLoading(vm);
vm.GET("portal/portalInfo/getProjectList", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.data;
//console.log(vm.tableData);
vm.totalRows = res.data.totalRows;
}
});
},
showCMEButton(row, type) {
// if(row.projectType == 2) {
// return true;
// } else {
// return false;
// }
// CME 专属状态码 为7~11，是这些代码的直接走新逻辑，别的走老逻辑
let cmeStatus = [7, 8, 9, 10, 11];
let currentStatus = parseInt(row.projectStatus);
if ( cmeStatus.indexOf(currentStatus) > -1 ) {
return true;
} else {
return false;
}
},
//按钮展示情况
showButton(row, type) {
// debugger;
// 按钮type类型： 0-编辑
// 1-暂存 2-完成 3-上架 4-通过 5-下架 6-拒绝
// 7- 提醒审核 8(2)-取消审核 9-删除
let projectStatus = row.projectStatus;
let idType = row.idType;
let level = row.level;
let flag = false;
let typeStr = parseInt(type);
//console.log("状态："+projectStatus+ "等级：" + level + " 按钮类型：" + type);
//console.log('idType',idType);
let buttonStatus = "";
if (idType == 1) {
//内部项目
buttonStatus = returnData().buttonStatusIn;
} else {
//外部项目
buttonStatus = returnData().buttonStatusOut;
}
if(projectStatus == null) {
return false;
}
if (level != null) {
let tempStatus = JSON.parse(JSON.stringify(projectStatus));
if (tempStatus > 6) {
tempStatus = 1;
}
let statusSet = buttonStatus[tempStatus - 1][level];
let flagValue = statusSet.indexOf(typeStr);
if (flagValue >= 0) {
flag = true;
} else {
flag = false;
}
}
//flag = true;
return flag;
},
handleCmeOperate(status) {
let text = '';
// 7.待初审 8.初审未通过 9.待复审 10.复审未通过 11.复审通过
if (status == 7 || status == 8) { // 按钮显示 初审
text = '初审';
} else if (status == 9 || status == 10) { // 按钮显示 复审
text = '复审';
} else if (status == 11) { // 按钮显示 发布
text = '发布';
}
this.cmeBtnText = text;
return text;
// return true / false;
},
//改变状态
changeStatus(row, type) {
let projectId = row.id;
let level = row.level;
if (type === 0) {
this.updateItemManager(this.formInline)
//编辑
if(row.projectType === 1) {
this.$router.push("edit-manager?projectType=1&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
} else if(row.projectType === 2) {
this.$router.push("edit-cme?projectType=2&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
}
} else if (type === 7) {
//提醒审核
let req = {
portalProjectId: projectId,
warnType: 1
};
vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
vm.$message.info(res.message);
vm.getProjectList();
if (res.code == "000000") {
console.log(res);
//vm.getProjectList();
}
});
} else {
// if (type === 8) {
// //取消审批值对应2
// type = 2;
// let req = {
// portalProjectId: projectId,
// warnType: 5
// };
// vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
// vm.$message.info(res.message);
// if (res.code == "000000") {
// console.log(res);
// vm.getProjectList();
// }
// });
// }
// if (type == 4 || type == 6) {
// //发送消息
// let warnType = "";
// if (type == 4) {
// warnType = 3;
// } else if (type == 6) {
// warnType = 4;
// }
// let req = {
// portalProjectId: projectId,
// warnType: warnType
// };
// vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
// vm.$message.info(res.message);
// if (res.code == "000000") {
// console.log(res);
// vm.getProjectList();
// }
// });
// }
let req = {
projectId: projectId,
changeStatus: vm.getType(type)
};
vm.POST("portal/portalInfo/changeStatus", req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
console.log(res);
vm.getProjectList();
//changeStatus之后remindPortalCheck
if (type == 4 || type == 6 || type == 8) {
//发送消息
let warnType = "";
if (type == 4) {
warnType = 3;
} else if (type == 6) {
warnType = 4;
} else if (type == 8) {
warnType = 5;
}
let req = {
portalProjectId: projectId,
warnType: warnType
};
vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
vm.getProjectList();
}
});
}
}
});
}
},
getType(value) {
let data = value;
if(data == 8) {
data = 2;
}
return data;
},
//删除项目
delItem(row) {
let req = {};
console.log(row);
vm.DELETE("portal/portalInfo/delete/" + row.id, req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
console.log(res);
vm.getProjectList();
}
});
},
//重置表单
resetForm() {
vm.formInline = Object.assign(
{},
{
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectStatus: "",
pageNo: 1,
pageSize: 10,
duringTime: ""
}
);
vm.getProjectList();
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formInline.pageSize = val;
this.handleCurrentChange(this.searchParam.pageNo);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formInline.pageNo = val;
this.getProjectList();
//需要判断是否检索
// if (!this.flag) {
// this.currentChangePage(this.tableDataEnd);
// } else {
// this.currentChangePage(this.filterTableDataEnd);
// }
}, //组件自带监控当前页码
currentChangePage(list) {
let from = (this.currentPage - 1) * this.pageSize;
let to = this.currentPage * this.pageSize;
this.tableDataEnd = [];
for (; from < to; from++) {
if (list[from]) {
this.tableDataEnd.push(list[from]);
}
}
},
addOrModifyNotice(row) {
this.$router.push("edit-notice?projectId=" + row.id);
}
}
};
</script>
<style lang="scss">
.item-manager-wrap {
.component-content {
background: #fff;
//margin-top: 88px;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
// .table-option span {
// color: #409eff;
// }
.add-button {
float: right;
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
.el-tooltip__popper {
max-width:50%
}
</style>
src/views/home copy 2.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="home-wrap">
<bread-crumb :curmbFirst="curmbFirst"></bread-crumb>
<div class="message-content">
<el-row>
<el-col class="visitor screenSet" :span="24">
<div class="visitor-title">
<div class="title">
今日履约：
<span style="color:#449284;margin-right: 10px">{{todayPlansList.length}}人</span>
<span
class="type-button"
:style="{background:(planBtn?'rgba(68,146,132,0.06)':'#ffffff')}"
@click="changeTodayPlansList(0)"
>未完成</span>
<span
class="type-button"
:style="{background:(!planBtn?'rgba(68,146,132,0.06)':'#ffffff')}"
@click="changeTodayPlansList(1)"
>已过期</span>
</div>
<span class="visitor-more" @click="lookMore(1)">查看更多</span>
</div>
<div class="visitor-info">
<el-table :data="todayPlansList" style="width: 100%">
<el-table-column prop="patientName" label="姓名" align="center"></el-table-column>
<el-table-column prop="appointTime" label="预约时间" align="center"></el-table-column>
<el-table-column prop="fuTypeStr" label="履约方式" align="center"></el-table-column>
<el-table-column prop="content" label="操作" align="center">
<template slot-scope="scope">
<span class="text-btn" @click="goToScale(scope.row)">履约录入</span> |
<span class="text-btn" @click="changeFollowStatus(scope.row)">变更履约状态</span>
</template>
</el-table-column>
</el-table>
</div>
</el-col>
<el-col class="visitor screenSet" :span="24" style="margin-top: 0;margin-bottom: 0;">
<div class="visitor-title">
<div class="title">
今日预约
<span
class="type-button"
:style="{background:(appointBtn?'rgba(68,146,132,0.06)':'#ffffff')}"
@click="changeTodayAppointsList(0)"
style="margin-left: 10px;"
>未完成</span>
<span
class="type-button"
:style="{background:(!appointBtn?'rgba(68,146,132,0.06)':'#ffffff')}"
@click="changeTodayAppointsList(1)"
>已过期</span>
</div>
<span class="visitor-more" @click="lookMore(2)">查看更多</span>
</div>
<div class="visitor-info">
<el-table :data="todayAppointsList" style="width: 100%">
<el-table-column prop="planName" label="履约计划名称" align="center"></el-table-column>
<el-table-column prop="appointTime" label="履约计划时间" align="center"></el-table-column>
<el-table-column prop="appointedCount" label="已经预约" align="center"></el-table-column>
<el-table-column prop="notAppointedCount" label="未预约" align="center"></el-table-column>
<el-table-column prop="content" label="操作" align="center">
<template slot-scope="scope">
<span
class="text-btn"
@click="goToReservation(scope.row.planName, scope.row.appointTime)"
>去预约</span>
</template>
</el-table-column>
</el-table>
</div>
</el-col>
<el-col class="message screenSet" :span="24" id="screenSet">
<div class="message-title">
系统消息
<span>今日消息：{{count}}条</span>
</div>
<div class="message-info" v-if="messageList.length > 0">
<div class="message-item" v-for="(item,index) in messageList" :key="index">
<div class="text-top">
<img :src="item.url" />
<span>{{item.menuName}}</span>
<span>{{item.portalTime}}</span>
</div>
<div class="text-bottom" v-html="item.content"></div>
</div>
</div>
<div class="no-message" v-else>
<div>
<img src="../assets/image/noData.png" />
</div>
</div>
</el-col>
</el-row>
</div>
<change-followup-status
:isShowChangeDialog="isShowChangeDialog"
:statusForm="statusForm"
@closeChangeStatus="closeChangeStatus()"
></change-followup-status>
<el-dialog
title="选择量表"
:visible.sync="selectFormShow"
center
:close-on-click-modal="false"
:close-on-press-escape="false"
width="400px"
:before-close="closeForm"
>
<div class="list-content">
<p
v-for="(item, index) in formList.scalesList"
:key="index"
@click="goFormView(item)"
>{{item.sendContent}}</p>
</div>
</el-dialog>
<!-- 敏感词及协议校验 -->
<el-dialog class="prot-dialog" title="" :visible.sync="isShowProtocolDialog" width="30%" center :show-close=false>
<p class="prot-dialog-tips-1">由于该居民尚未同意《云鹊平台隐私协议》，将导致履约量表部分信息无法录入，为了方便您的工作开展，请您发送短信提醒居民完成授权</p>
<p v-show="!isSentedProt" class="prot-dialog-tips-2">若您选择暂不发送，您只能录入量表的非敏感信息</p>
<p v-show="isSentedProt" class="prot-dialog-tips-3">为避免打扰居民，7天内只能发送1次，您已发送过短信，请尽快联系居民同意授权</p>
<span v-show="!isSentedProt" slot="footer" class="dialog-footer">
<el-button size="small" @click="closeProtocolDialog"> 暂不发送 </el-button>
<el-button size="small" type="primary" @click="sendMsg"> 发送短信 </el-button>
</span>
<span v-show="isSentedProt" slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="closeProtocolDialog"> 我知道了 </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import BreadCrumb from "../components/breadcrumb.vue";
import { setTimeout, setInterval } from "timers";
import ChangeFollowupStatus from "./followup/record-manage/dialog/change-followup-status";
import { mapGetters, mapState, mapActions } from "vuex";
import * as commonUtil from "../utils/utils";
import { uniteValidate, authMessage } from '@/utils/followup/followapis'
let vm = null;
export default {
components: {
BreadCrumb,
ChangeFollowupStatus
},
data() {
return {
curmbFirst: "数据总览",
spanFirstNum: 12,
spanSecondNum: 12,
tableData: [],
count: 0,
messageList: [],
planBtn: true,
appointBtn: true,
isShowChangeDialog: false,
statusForm: {},
selectFormShow: false,
ScaleData: {},
isShowProtocolDialog: true,
scaleQuery: {},
isSentedProt: false,
scaleNo: '',
patientIds: [],
sendMsgPatientIds: [],
};
},
created() {
vm = this;
vm.getSystemData();
vm.getTodayPlansList({
status: 0
});
vm.getTodayAppointsList({
status: 0
});
/*vm.getTodayOverview({
status:0
});*/
},
computed: {
...mapGetters(["_token"]),
...mapState("workbench", {
todayPlansList: state => state.todayPlansList,
todayAppointsList: state => state.todayAppointsList
//todayOverview: state => state.todayOverview,
}),
...mapState("recordManage", {
formList: state => state.formList
})
},
// 挂载到Dom完成时
mounted: function() {
// commonUtil.resizeHeight()
},
methods: {
...mapActions("workbench", [
"getTodayPlansList",
"getTodayAppointsList",
"getTodayOverview"
]),
...mapActions("recordManage", ["getFormList"]),
// 查看更多
lookMore(type) {
if (type == 1) {
this.$router.push("/followup/record-manage/record-list");
} else if (type == 2) {
this.$router.push("/followup/reservation-manage/reservation-list");
}
},
// 获取系统消息数据
getSystemData() {
vm.GET("portal/portalMessage/queryPortalMessageInfo", {
token: vm._token,
pageNo: 1,
pageSize: 15
}).then(res => {
if (res.code == "000000") {
vm.messageList = res.data.portalMessageModels;
vm.count = res.data.count;
} else {
vm.$message.info(res.message);
}
});
},
changeTodayPlansList(status) {
if (status == 0) {
vm.planBtn = true;
} else {
vm.planBtn = false;
}
vm.getTodayPlansList({
status: status
});
},
changeTodayAppointsList(status) {
if (status == 0) {
vm.appointBtn = true;
} else {
vm.appointBtn = false;
}
vm.getTodayAppointsList({
status: status
});
},
goToReservation(planName, appointTime) {
this.$router.push({
path: "/followup/reservation-manage/reservation-list",
query: { planName: planName, appointTime: appointTime, status: 1 }
});
},
closeChangeStatus(val) {
this.isShowChangeDialog = val;
let status = null;
if (this.planBtn == true) {
status = 0;
} else {
status = 1;
}
this.getTodayPlansList({
status: status
});
},
goFormView(item) {
this.selectFormShow = false;
this.$router.push({
path: "/followup/record-manage/form-template",
query: {
doctorId: this.ScaleData.doctorId,
scaleNo: item.resourceId,
planPatientsTimesId: this.ScaleData.planPatientsTimesId,
planTimesId: item.planTimesId,
showBtn: 1
}
});
// this.scaleQuery = {
// doctorId: this.ScaleData.doctorId,
// scaleNo: item.resourceId,
// planPatientsTimesId: this.ScaleData.planPatientsTimesId,
// planTimesId: item.planTimesId,
// showBtn: 1
// }
// this.needSign()
// this.scaleNo = this.formList.scalesList[0].resourceId;
// this.patientIds = [row.patientId];
// this.uniteValidateAction()
},
closeForm() {
this.selectFormShow = false;
},
async goToScale(row) {
await this.getFormList(row.planTimesId); //获取量表列表
//获取量表列表情况
if (this.formList.scalesList.length > 1) {
this.selectFormShow = true;
this.ScaleData = {
doctorId: this.formList.doctorId,
planPatientsTimesId: row.planPatientTimesId
};
} else if (this.formList.scalesList.length === 1) {
this.$router.push({
path: "/followup/record-manage/form-template",
query: {
doctorId: this.formList.doctorId,
scaleNo: this.formList.scalesList[0].resourceId,
planPatientsTimesId: row.planPatientTimesId,
planTimesId: row.planTimesId,
showBtn: 1
}
});
// this.scaleQuery = {
// doctorId: this.formList.doctorId,
// scaleNo: this.formList.scalesList[0].resourceId,
// planPatientsTimesId: row.planPatientTimesId,
// planTimesId: row.planTimesId,
// showBtn: 1
// }
// this.needSign()
// this.scaleNo = this.formList.scalesList[0].resourceId;
// this.patientIds = [row.patientId];
// this.uniteValidateAction()
} else {
this.$message.warning("暂无量表!");
}
},
changeFollowStatus(row) {
this.statusForm = {
fuPlanPatientTimesId: row.planPatientTimesId,
patientId: row.patientId,
nickname: row.patientName,
status: 1
};
this.isShowChangeDialog = true;
},
// Add by Anndy Yang
// 统一验证：量表内是否存在敏感字段、居民是否签署隐私协议、7天内是否发送过授权短信
async uniteValidateAction() {
let validParams = {
scaleNo: this.scaleNo,
patientIds: this.patientIds, // pc端只传这个字段
// planPatientsTimesId: planPatientsTimesId, // app端只传这个字段
protocolType: 5,
userType: 1,
validateType: 1
};
let r = await uniteValidate(validParams).then(res => {
let result = res;
// 请求成功
if (result.code === '000000') {
let levelType = result.data.levelType;
// 没有敏感字段或者居民已经签订过协议，则直接返回
if (levelType === 1 || levelType === 2) {
jumpToScale()
} else if (levelType === 3) {
this.isShowProtocolDialog = true;
this.isSentedProt = false;
} else if (levelType === 4) {
this.isShowProtocolDialog = true;
this.isSentedProt = true;
this.sendMsgPatientIds = result.data.ids;
}
}
});
},
// 发送协议授权短信给居民
sendMsgToPatients() {
authMessage({ patientIds: this.sendMsgPatientIds }).then(res => {
if (res.code === '000000') {
this.$message({
message: '已发送，请尽快联系居民同意授权',
type: 'success'
});
}
});
this.isShowDialog = false;
},
// 敏感词校验与签署协议逻辑
// 1. 判断量表内是否存在敏感词
// 2. 判断居民是否存签署协议
// 3. 七天内是否发送过
needSign(scaleId, query) {
// let statusConfig =await getStatusByScaleId(scaleId)
let statusConfig = {
isSensitive: 1, // 量表内是否存在敏感词 0: 否；1: 是
hasProtocol: 0, // 居民是否存签署协议 0: 否；1: 是
hasSented: 0 // 七天内是否发送过 0: 否；1: 是
};
if (statusConfig.isSensitive == 1 && statusConfig.hasProtocol == 0) {
this.isShowProtocolDialog = true
this.isSentedProt = statusConfig.hasSented == 1
} else {
this.jumpToScale()
}
},
// 统一跳转到量表页面
jumpToScale() {
// this.$router.push({
// path: "/followup/record-manage/form-template",
// query: this.scaleQuery
// });
},
// 关闭协议确认窗口
closeProtocolDialog() {
this.isShowProtocolDialog = false
this.jumpToScale()
},
// 发送短信通知
sendMsg() {
this.sendMsgToPatients();
this.closeProtocolDialog()
},
}
};
</script>
<style lang="scss">
.home-wrap {
.list-content {
p {
cursor: pointer;
line-height: 30px;
text-decoration: underline;
color: #449284;
}
}
.message-content {
.visitor {
padding: 0 25px 30px;
margin-bottom: 20px;
background: #fff;
margin-top: 88px;
// min-height: 348px;
@media screen and (min-width: 1240px) and (max-width: 1900px) {
width: 95%;
height: 300px !important;
}
@media screen and (min-width: 1900px) {
width: 96.7%;
height: 380px !important;
}
.visitor-title {
height: 80px;
line-height: 80px;
margin-right: 20px;
text-align: right;
.title {
float: left;
font-size: 20px;
}
.visitor-more {
font-size: 12px;
color: #449284;
border: 1px solid rgba(68, 146, 132, 0.3);
padding: 5px 14px;
border-radius: 3px;
background: rgba(68, 146, 132, 0.06);
cursor: pointer;
}
.type-button {
font-size: 12px;
color: #449284;
border: 1px solid rgba(68, 146, 132, 0.3);
padding: 5px 14px;
border-radius: 3px;
/*background: rgba(68,146,132,0.06);*/
background: #ffffff;
cursor: pointer;
}
}
.visitor-info {
margin-right: 20px;
.text-btn:hover {
cursor: pointer;
color: #449284;
}
}
}
.message {
padding: 0 25px 30px;
// margin-top: 20px;
margin-top: 20px;
background: #fff;
@media screen and (min-width: 1240px) and (max-width: 1900px) {
width: 95%;
// height: 320px !important;
}
@media screen and (min-width: 1900px) {
width: 96.7%;
// height: 400px !important;
}
.message-title {
font-size: 20px;
height: 80px;
line-height: 80px;
span {
font-size: 14px;
color: #717377;
margin-left: 8px;
}
}
.message-info {
padding: 7px;
.message-item {
padding: 10px 10px 15px;
border-bottom: 1px solid #ebeef5;
.text-top {
img {
float: left;
width: 16px;
margin-top: 3px;
}
span:nth-child(2) {
padding: 10px;
}
span:nth-child(3) {
font-size: 12px;
color: #999;
}
}
.text-bottom {
font-size: 14px;
color: #666;
margin-top: 15px;
}
}
}
}
.no-message {
text-align: center;
img {
width: 100px;
// margin-top: 17%;
margin: 6% 0 6%;
}
}
}
}
</style>
src/views/home copy.vue 已删除 100644 → 0
浏览文件 @ 95c7ec2e
<template>
<div class="home-wrap">
<bread-crumb :curmbFirst="curmbFirst"></bread-crumb>
<div class="message-content">
<el-row>
<el-col class="visitor screenSet" :span="24">
<div class="visitor-title">
<div class="title">今日履约：
<span style="color:#449284;margin-right: 10px">{{todayPlansList.length}}人</span>
<span class="type-button" :style="{background:(planBtn?'rgba(68,146,132,0.06)':'#ffffff')}" @click="changeTodayPlansList(0)">未完成</span>
<span class="type-button" :style="{background:(!planBtn?'rgba(68,146,132,0.06)':'#ffffff')}" @click="changeTodayPlansList(1)">已过期</span>
</div>
<span class="visitor-more" @click="lookMore(1)">查看更多</span>
</div>
<div class="visitor-info">
<el-table
:data="todayPlansList"
style="width: 100%">
<el-table-column prop="patientName" label="姓名" align="center"></el-table-column>
<el-table-column prop="appointTime" label="预约时间" align="center"></el-table-column>
<el-table-column prop="fuTypeStr" label="履约方式" align="center"></el-table-column>
<el-table-column prop="content" label="操作" align="center">
<template slot-scope="scope">
<span class="text-btn" @click="goToScale(scope.row)">履约录入</span> | <span class="text-btn" @click="changeFollowStatus(scope.row)">变更履约状态</span>
</template>
</el-table-column>
</el-table>
</div>
</el-col>
<el-col class="visitor screenSet" :span="24" style="margin-top: 0;margin-bottom: 0;">
<div class="visitor-title">
<div class="title">今日预约
<span class="type-button" :style="{background:(appointBtn?'rgba(68,146,132,0.06)':'#ffffff')}" @click="changeTodayAppointsList(0)" style="margin-left: 10px;">未完成</span>
<span class="type-button" :style="{background:(!appointBtn?'rgba(68,146,132,0.06)':'#ffffff')}" @click="changeTodayAppointsList(1)" >已过期</span>
</div>
<span class="visitor-more" @click="lookMore(2)">查看更多</span>
</div>
<div class="visitor-info">
<el-table
:data="todayAppointsList"
style="width: 100%">
<el-table-column prop="planName" label="履约计划名称" align="center"></el-table-column>
<el-table-column prop="appointTime" label="履约计划时间" align="center"></el-table-column>
<el-table-column prop="appointedCount" label="已经预约" align="center"></el-table-column>
<el-table-column prop="notAppointedCount" label="未预约" align="center"></el-table-column>
<el-table-column prop="content" label="操作" align="center">
<template slot-scope="scope">
<span class="text-btn" @click="goToReservation(scope.row.planName, scope.row.appointTime)">去预约</span>
</template>
</el-table-column>
</el-table>
</div>
</el-col>
<el-col class="message screenSet" :span="24" id="screenSet">
<div class="message-title">系统消息 <span>今日消息：{{count}}条</span></div>
<div class="message-info" v-if="messageList.length > 0">
<div class="message-item" v-for="(item,index) in messageList" :key="index">
<div class="text-top">
<img :src="item.url"/>
<span>{{item.menuName}}</span>
<span>{{item.portalTime}}</span>
</div>
<div class="text-bottom" v-html="item.content"></div>
</div>
</div>
<div class="no-message" v-else>
<div>
<img src="../assets/image/noData.png"/>
</div>
</div>
</el-col>
</el-row>
</div>
<change-followup-status :isShowChangeDialog="isShowChangeDialog" :statusForm="statusForm" @closeChangeStatus="closeChangeStatus()"></change-followup-status>
<el-dialog title="选择量表"
:visible.sync="selectFormShow"
center
:close-on-click-modal="false"
:close-on-press-escape="false"
width="400px"
:before-close="closeForm">
<div class="list-content">
<p v-for="(item, index) in formList.scalesList" :key="index" @click="goFormView(item)">{{item.sendContent}}</p>
</div>
</el-dialog>
</div>
</template>
<script>
import BreadCrumb from '../components/breadcrumb.vue'
import { setTimeout, setInterval } from 'timers'
import ChangeFollowupStatus from "./followup/record-manage/dialog/change-followup-status";
import { mapGetters, mapState, mapActions } from 'vuex'
import * as commonUtil from '../utils/utils'
let vm = null
export default {
components: {
BreadCrumb,
ChangeFollowupStatus
},
data() {
return {
curmbFirst: '数据总览',
spanFirstNum: 12,
spanSecondNum: 12,
tableData: [],
count: 0,
messageList:[],
planBtn: true,
appointBtn: true,
isShowChangeDialog: false,
statusForm: {},
selectFormShow: false,
ScaleData: {}
}
},
created() {
vm = this
vm.getSystemData()
vm.getTodayPlansList({
status:0
});
vm.getTodayAppointsList({
status:0
});
/*vm.getTodayOverview({
status:0
});*/
},
computed: {
...mapGetters([
'_token'
]),
...mapState('workbench', {
todayPlansList: state => state.todayPlansList,
todayAppointsList: state => state.todayAppointsList,
//todayOverview: state => state.todayOverview,
}),
...mapState('recordManage',{
formList: state => state.formList,
}),
},
// 挂载到Dom完成时
mounted: function() {
// commonUtil.resizeHeight()
},
methods: {
...mapActions('workbench', ['getTodayPlansList', 'getTodayAppointsList', 'getTodayOverview']),
...mapActions('recordManage', ['getFormList']),
// 查看更多
lookMore(type) {
if(type==1) {
this.$router.push('/followup/record-manage/record-list');
} else if(type == 2) {
this.$router.push('/followup/reservation-manage/reservation-list');
}
},
// 获取系统消息数据
getSystemData() {
vm.GET('portal/portalMessage/queryPortalMessageInfo',{token: vm._token, pageNo: 1, pageSize: 15}).then((res) => {
if( res.code == '000000') {
vm.messageList = res.data.portalMessageModels
vm.count = res.data.count
} else {
vm.$message.info(res.message)
}
})
},
changeTodayPlansList(status) {
if(status == 0) {
vm.planBtn = true
} else {
vm.planBtn = false
}
vm.getTodayPlansList({
status: status
});
},
changeTodayAppointsList(status) {
if(status == 0) {
vm.appointBtn = true
} else {
vm.appointBtn = false
}
vm.getTodayAppointsList({
status: status
});
},
goToReservation(planName, appointTime) {
this.$router.push({path: '/followup/reservation-manage/reservation-list', query: {planName: planName, appointTime:appointTime, status: 1}});
},
closeChangeStatus(val){
this.isShowChangeDialog = val;
let status = null
if(this.planBtn == true) {
status = 0
} else {
status = 1
}
this.getTodayPlansList({
status: status
})
},
goFormView(item) {
this.selectFormShow = false
this.$router.push({path: '/followup/record-manage/form-template',
query: {doctorId: this.ScaleData.doctorId, scaleNo: item.resourceId, planPatientsTimesId: this.ScaleData.planPatientsTimesId,planTimesId : item.planTimesId, showBtn: 1}});
},
closeForm() {
this.selectFormShow = false;
},
async goToScale(row) {
await this.getFormList(row.planTimesId); //获取量表列表
//获取量表列表情况
if(this.formList.scalesList.length > 1){
this.selectFormShow = true
this.ScaleData = {
doctorId: this.formList.doctorId,
planPatientsTimesId: row.planPatientTimesId
}
}else if(this.formList.scalesList.length === 1){
this.$router.push({path: '/followup/record-manage/form-template',
query: {doctorId: this.formList.doctorId, scaleNo: this.formList.scalesList[0].resourceId, planPatientsTimesId: row.planPatientTimesId,planTimesId : row.planTimesId, showBtn: 1}})
}else {
this.$message.warning('暂无量表!')
}
},
changeFollowStatus(row) {
this.statusForm = {
fuPlanPatientTimesId: row.planPatientTimesId,
patientId: row.patientId,
nickname: row.patientName,
status: 1,
}
this.isShowChangeDialog = true
}
}
}
</script>
<style lang="scss">
.home-wrap {
.list-content{
p{
cursor: pointer;
line-height: 30px;
text-decoration: underline;
color: #449284;
}
}
.message-content {
.visitor {
padding: 0 25px 30px;
margin-bottom: 20px;
background: #fff;
margin-top: 88px;
// min-height: 348px;
@media screen and (min-width:1240px) and (max-width:1900px) {
width: 95%;
height: 300px !important;
}
@media screen and (min-width:1900px) {
width: 96.7%;
height: 380px !important;
}
.visitor-title {
height: 80px;
line-height: 80px;
margin-right: 20px;
text-align: right;
.title {
float: left;
font-size: 20px;
}
.visitor-more {
font-size: 12px;
color: #449284;
border: 1px solid rgba(68,146,132,0.3);
padding: 5px 14px;
border-radius: 3px;
background: rgba(68,146,132,0.06);
cursor: pointer;
}
.type-button {
font-size: 12px;
color: #449284;
border: 1px solid rgba(68,146,132,0.3);
padding: 5px 14px;
border-radius: 3px;
/*background: rgba(68,146,132,0.06);*/
background: #ffffff;
cursor: pointer;
}
}
.visitor-info {
margin-right: 20px;
.text-btn:hover {
cursor: pointer;
color: #449284;
}
}
}
.message {
padding: 0 25px 30px;
/*margin-top: 20px;*/
margin-top: 90px;
background: #fff;
@media screen and (min-width:1240px) and (max-width:1900px) {
width: 95%;
// height: 320px !important;
}
@media screen and (min-width:1900px) {
width: 96.7%;
// height: 400px !important;
}
.message-title {
font-size: 20px;
height: 80px;
line-height: 80px;
span {
font-size: 14px;
color: #717377;
margin-left: 8px;
}
}
.message-info {
padding: 7px;
.message-item {
padding: 10px 10px 15px;
border-bottom: 1px solid #EBEEF5;
.text-top {
img {
float: left;
width: 16px;
margin-top: 3px;
}
span:nth-child(2) {
padding: 10px;
}
span:nth-child(3) {
font-size: 12px;
color: #999;
}
}
.text-bottom {
font-size: 14px;
color: #666;
margin-top: 15px;
}
}
}
}
.no-message {
text-align: center;
img {
width: 100px;
// margin-top: 17%;
margin: 6% 0 6%;
}
}
}
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或