admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改 金林湾bug（安全教育页面）分类回显、新增显示

Browse Source
This commit is contained in:
骆乐 2022-11-18 13:54:38 +08:00
parent 9c0d409744
commit ed3c060124
2 changed files with 305 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/views/projectFront/safetyEducation/addCourse.vue
View File

@ -30,15 +30,15 @@
</el-select>
</el-form-item>
<!-- 课程分类 -->
<el-form-item :label="$t('message.safetyEducation.courseClass')" prop="classifyName">
<el-select :disabled="classifyId!=''"
<el-form-item :label="$t('message.safetyEducation.courseClass')" prop="classifyId">
<el-select :disabled="eduId!=''"
style="width: 100%"
v-model="ruleForm.classifyName"
v-model="ruleForm.classifyId"
:placeholder="$t('message.safetyEducation.pleaseEnter')"
>
<el-option
v-for="item in classifyList"
:key="item.id+'classify'"
:key="item.id"
:label="item.classifyName"
:value="item.id"
>
@ -331,8 +331,8 @@ export default {
questionList: [],
totalScore: "",
videoType: 1,
classifyId:'',
classifyName:""
classifyId:"",
classifyName:"",
},
indexList: [
"A",
@ -397,7 +397,7 @@ export default {
// 请选择课程类型
{ required: true, message: this.$t('message.safetyEducation.rulesA2'), trigger: "change" },
],
classifyName:[
classifyId:[
// 请选择课程分类
{ required: true, message: this.$t('message.safetyEducation.rulesA3'), trigger: "change" }
],
@ -429,21 +429,29 @@ export default {
},
mounted(){
// console.log(process.env.NODE_ENV)
console.log("进入 mounted--1", this.classifyId);
if(this.classifyId != ''){
this.ruleForm.classifyName= this.$route.query.name
console.log('=====',this.ruleForm.classifyName)
this.ruleForm.classifyId=parseInt(this.classifyId)
this.ruleForm.classifyId=this.classifyId
console.log("this.ruleForm.classifyId", this.ruleForm.classifyId);
}
console.log("进入 mounted--2", this.classifyId);
this.styleType = this.$store.state.userInfo.styleType
console.log(this.styleType)
if(this.eduId==''){
console.log("进入 mounted--3", this.classifyId);
if(this.$route.path.indexOf('/project/')!=-1){
this.ruleForm.projectSn=this.$store.state.projectSn
}else{
this.ruleForm.projectSn=this.$store.state.userInfo.headquartersSn
}
this.getClassifyList()
console.log("进入 mounted--4", this.classifyId);
this.getClassifyList()
}else{
console.log("进入 mounted--5", this.eduId);
this.createQRcode('')
this.getDetailData()
}
@ -514,6 +522,12 @@ export default {
safeEducationQuestionDetailApi({eduId:this.eduId}).then(res=>{
this.ruleForm=res.result.safeEducation
this.ruleForm.classifyName = this.$route.query.name
console.log('分类详细数据',this.ruleForm.classifyName);
console.log('详细数据',this.ruleForm);
if(this.ruleForm.projectSn != null) {
console.log("getDetailData 调用 getClassifyList -- ",this.ruleForm.projectSn);
this.getClassifyList()
}
})
},
addOptions() {
@ -686,6 +700,7 @@ export default {
type=1
}
this.ruleForm.type=type
console.log("this.ruleForm",this.ruleForm);
safeEducationQuestionAddApi(this.ruleForm).then(res=>{
// 保存成功！
this.$message.success(this.$t('message.safetyEducation.savedSuccess'))

461
src/views/projectFront/safetyEducation/courseManage.vue
View File

@ -1,38 +1,75 @@
<template>
<div class="fullHeight">
<div class="fullHeight" v-if="pageType == 'list'" style="position:relative">
<div
class="fullHeight"
v-if="pageType == 'list'"
style="position: relative"
>
<!--courseManagement 课程管理 -->
<el-page-header style="margin-bottom:15px" v-if="$route.path.indexOf('/project/')==-1"
<el-page-header
style="margin-bottom: 15px"
v-if="$route.path.indexOf('/project/') == -1"
@back="goBack2"
:content="parentName+' /' + $t('message.safetyEducation.courseManagement') "
:content="
parentName + ' /' + $t('message.safetyEducation.courseManagement')
"
class="backText"
></el-page-header>
<!-- <el-tabs v-model="activeName" @tab-click="getList" v-if="$route.path.indexOf('/project/')!=-1">
<!-- <el-tabs v-model="activeName" @tab-click="getList" v-if="$route.path.indexOf('/project/')!=-1">
<el-tab-pane label="企业课程" name="company"></el-tab-pane>
<el-tab-pane label="项目课程" name="project"></el-tab-pane>
</el-tabs> -->
<!-- v-if="$route.path.indexOf('/project/')==-1" -->
<!-- v-if="$route.path.indexOf('/project/')==-1" -->
<div class="classificationBox" v-else>
<span :class="{'active':parentId==''}" @click="parentId='';getList()">
<span
:class="{ active: parentId == '' }"
@click="
parentId = '';
getList();
"
>
<!-- 全部 -->
{{ $t('message.safetyEducation.whole') }}
</span>
<span :class="{'active':parentId==item.id}" v-for="(item,index) in classifyList" :key="index" @click="parentId=item.id;getList()">{{item.classifyName}}
<i class="el-icon-error" v-if="activeName=='project'" @click.stop="deleteClassifyFn(item)"></i>
{{ $t("message.safetyEducation.whole") }}
</span>
<span class="addTypeBtn" @click="addClassifyFn" v-if="$route.path.indexOf('/project/')==-1||activeName=='project'"> <i class="el-icon-plus"></i>
<!-- 新增类型 -->
{{ $t('message.safetyEducation.newType') }}
<span
:class="{ active: parentId == item.id }"
v-for="item in classifyList"
:key="item.id"
:label="item.classifyName"
:value="item.id"
@click="
parentId = item.id;
getList();
"
>{{ item.classifyName }}
<i
class="el-icon-error"
v-if="activeName == 'project'"
@click.stop="deleteClassifyFn(item)"
></i>
</span>
<span
class="addTypeBtn"
@click="addClassifyFn"
v-if="
$route.path.indexOf('/project/') == -1 || activeName == 'project'
"
>
<i class="el-icon-plus"></i>
<!-- 新增类型 -->
{{ $t("message.safetyEducation.newType") }}
</span>
</div>
<div v-show="activeName=='project'||$route.path.indexOf('/project/')==-1" style="margin: 10px 15px;position:absolute;right:20px;top:-10px">
<el-button type="primary" size="medium" @click="addFn"
>
<div
v-show="
activeName == 'project' || $route.path.indexOf('/project/') == -1
"
style="margin: 10px 15px; position: absolute; right: 20px; top: -10px"
>
<el-button type="primary" size="medium" @click="addFn">
<!-- 新增课程 -->
{{ $t('message.safetyEducation.newCourses') }}
</el-button
>
{{ $t("message.safetyEducation.newCourses") }}
</el-button>
<el-button type="warning" plain size="medium" @click="refresh">{{
$t("message.alarmValueSet.refresh")
}}</el-button>
@ -54,20 +91,31 @@
></video>
<div class="desc">
<!-- <span class="time">30分钟</span> -->
<span v-if="item.eduWorkerNum">{{ item.eduWorkerNum }}
{{$t("message.safetyEducation.humanLearning")}}
<span v-if="item.eduWorkerNum"
>{{ item.eduWorkerNum }}
{{ $t("message.safetyEducation.humanLearning") }}
<!-- 人学习 -->
</span>
</span>
</div>
<div class="mask" @click.stop="editBefore(item)">
<!-- 进入题库 -->
{{$t("message.safetyEducation.enterQuestionBank")}}
</div>
{{ $t("message.safetyEducation.enterQuestionBank") }}
</div>
</div>
<div class="title" @click="editBefore(item)">{{ item.eduCourseName }}</div>
<div @click.stop="deleteBefore(item)" class="deleteBtn" v-show="activeName=='project'">
<img src="@/assets/images/icon-delete.png" width="15px" height="15px"/>
<!-- <span>{{$t('message.workType.delete')}}</span> -->
<div class="title" @click="editBefore(item)">
{{ item.eduCourseName }}
</div>
<div
@click.stop="deleteBefore(item)"
class="deleteBtn"
v-show="activeName == 'project'"
>
<img
src="@/assets/images/icon-delete.png"
width="15px"
height="15px"
/>
<!-- <span>{{$t('message.workType.delete')}}</span> -->
</div>
</div>
</div>
@ -77,7 +125,7 @@
<img src="@/assets/images/noData.png" alt="" />
<p>
<!-- 暂无课程 -->
{{$t("message.safetyEducation.noCourses")}}
{{ $t("message.safetyEducation.noCourses") }}
</p>
</div>
<el-pagination
@ -97,54 +145,84 @@
<!-- '新增课程' : '课程详细' -->
<el-page-header
@back="goBack"
:content="(itemId == '' ? $t('message.safetyEducation.newType') : $t('message.safetyEducation.courseDetails'))"
:content="
itemId == ''
? $t('message.safetyEducation.newType')
: $t('message.safetyEducation.courseDetails')
"
class="backText"
></el-page-header>
<addCourse :eduId="itemId" :classifyId="parentId" @showList="goBack"></addCourse>
<addCourse
:eduId="itemId"
:classifyId="parentId"
@showList="goBack"
></addCourse>
</div>
<!-- 添加分类 -->
<el-dialog
:modal-append-to-body="false"
:title="$t('message.safetyEducation.addCategory')"
:visible.sync="dialogVisible"
width="667px">
:modal-append-to-body="false"
:title="$t('message.safetyEducation.addCategory')"
:visible.sync="dialogVisible"
width="667px"
>
<div class="dialog_content">
<el-form label-width="120px" size="medium" class="dialogFormBox" ref="addEditForm" :model="classifyForm">
<!-- 分类名称 -->
<el-form-item :label="$t('message.safetyEducation.classificationName')" prop="classifyName" :rules="[
{ required: true, message: $t('message.safetyEducation.pleaseEnter'), trigger: 'blur' }
]">
<el-input v-model="classifyForm.classifyName"
:placeholder="$t('message.workType.placeholder')"></el-input>
</el-form-item>
<div class="dialog-footer">
<el-button
class="cancleBtn"
@click="dialogVisible = false"
icon="el-icon-circle-close"
size="medium"
>{{$t('message.personnelPosition.cancel')}}
</el-button>
<el-button
type="primary"
icon="el-icon-circle-check"
@click="saveClassifyFn"
size="medium"
>{{$t('message.personnelPosition.determine')}}
</el-button>
</div>
</el-form>
<el-form
label-width="120px"
size="medium"
class="dialogFormBox"
ref="addEditForm"
:model="classifyForm"
>
<!-- 分类名称 -->
<el-form-item
:label="$t('message.safetyEducation.classificationName')"
prop="classifyName"
:rules="[
{
required: true,
message: $t('message.safetyEducation.pleaseEnter'),
trigger: 'blur',
},
]"
>
<el-input
v-model="classifyForm.classifyName"
:placeholder="$t('message.workType.placeholder')"
></el-input>
</el-form-item>
<div class="dialog-footer">
<el-button
class="cancleBtn"
@click="dialogVisible = false"
icon="el-icon-circle-close"
size="medium"
>{{ $t("message.personnelPosition.cancel") }}
</el-button>
<el-button
type="primary"
icon="el-icon-circle-check"
@click="saveClassifyFn"
size="medium"
>{{ $t("message.personnelPosition.determine") }}
</el-button>
</div>
</el-form>
</div>
</el-dialog>
</el-dialog>
</div>
</template>
<script>
import {
safeEducationQuestionListApi,
workerSafeEducationDeleteApi,selectCompanyEducationCoursePageApi
workerSafeEducationDeleteApi,
selectCompanyEducationCoursePageApi,
} from "@/assets/js/api/laborPerson";
import {
educationClassifyAddApi,
educationClassifyEditApi,
educationClassifyDeleteApi,
educationClassifyListApi,
} from "@/assets/js/api/laborPerson";
import {educationClassifyAddApi, educationClassifyEditApi, educationClassifyDeleteApi, educationClassifyListApi} from '@/assets/js/api/laborPerson'
import addCourse from "./addCourse";
export default {
components: { addCourse },
@ -158,76 +236,83 @@ export default {
total: 0, //总条数
},
itemId: "",
parentId:'',
parentName:'',
activeName:'company',
classifyList:[],
dialogVisible:false,
classifyForm:{
classifyName:''
parentId: "",
parentName: "",
activeName: "company",
classifyList: [],
dialogVisible: false,
classifyForm: {
classifyName: "",
},
dataSn:''
dataSn: "",
};
},
mounted() {
if(this.$route.params.type){
this.activeName=this.$route.params.type
}else{
this.parentId=this.$route.query.id
if (this.$route.params.type) {
this.activeName = this.$route.params.type;
} else {
this.parentId = this.$route.query.id;
}
if(this.activeName=='company'){
this.dataSn=this.$store.state.userInfo.headquartersSn
}else{
this.dataSn=this.$store.state.projectSn
if (this.activeName == "company") {
this.dataSn = this.$store.state.userInfo.headquartersSn;
} else {
this.dataSn = this.$store.state.projectSn;
}
this.parentName=this.$route.query.name
this.getClassifyList()
this.parentName = this.$route.query.name;
this.getClassifyList();
this.getList();
},
watch: {
$route(to, from) {
if(this.$route.params.type){
this.activeName=this.$route.params.type
if(this.activeName=='company'){
this.dataSn=this.$store.state.userInfo.headquartersSn
}else{
this.dataSn=this.$store.state.projectSn
if (this.$route.params.type) {
this.activeName = this.$route.params.type;
if (this.activeName == "company") {
this.dataSn = this.$store.state.userInfo.headquartersSn;
} else {
this.dataSn = this.$store.state.projectSn;
}
this.parentId=''
this.pageType='list'
this.parentId = "";
this.pageType = "list";
}
this.getClassifyList()
this.getClassifyList();
this.getList();
},
},
methods: {
goBack2(){
this.$router.back()
goBack2() {
this.$router.back();
},
refresh() {
this.getList();
},
getList() {
let sn = this.$store.state.projectSn
let type =1 // 2总企业，1项目
if(this.activeName=='company'){
sn=this.$store.state.userInfo.headquartersSn
type=2
let sn = this.$store.state.projectSn;
let type = 1; // 2总企业，1项目
if (this.activeName == "company") {
sn = this.$store.state.userInfo.headquartersSn;
type = 2;
selectCompanyEducationCoursePageApi({
sn: sn,type:type,classifyId:this.parentId,pageNo:this.pageInfo.pageNo,pageSize:this.pageInfo.pageSize
sn: sn,
type: type,
classifyId: this.parentId,
pageNo: this.pageInfo.pageNo,
pageSize: this.pageInfo.pageSize,
}).then((res) => {
this.workerList = res.result.records;
this.pageInfo.total = res.result.total;
});
}else{
} else {
safeEducationQuestionListApi({
projectSn: sn,type:type,classifyId:this.parentId,pageNo:this.pageInfo.pageNo,pageSize:this.pageInfo.pageSize
projectSn: sn,
type: type,
classifyId: this.parentId,
pageNo: this.pageInfo.pageNo,
pageSize: this.pageInfo.pageSize,
}).then((res) => {
this.workerList = res.result.records;
this.pageInfo.total = res.result.total;
});
}
},
goBack() {
this.pageType = "list";
@ -239,16 +324,20 @@ export default {
},
editBefore(item) {
this.itemId = item.id;
console.log('展示')
console.log("展示");
this.pageType = "detail";
},
deleteBefore(item) {
// 此操作将永久删除该课程, 是否继续?
this.$confirm(this.$t("message.safetyEducation.permanentlyDelete"), this.$t("message.safetyEducation.tips"), {
confirmButtonText: this.$t("message.safetyEducation.determine"), // determine
cancelButtonText: this.$t("message.safetyEducation.cancel"), // 取消
type: "warning",
})
this.$confirm(
this.$t("message.safetyEducation.permanentlyDelete"),
this.$t("message.safetyEducation.tips"),
{
confirmButtonText: this.$t("message.safetyEducation.determine"), // determine
cancelButtonText: this.$t("message.safetyEducation.cancel"), // 取消
type: "warning",
}
)
.then(() => {
workerSafeEducationDeleteApi({ id: item.id }).then((res) => {
this.$message({
@ -274,62 +363,73 @@ export default {
this.getList();
},
getClassifyList() {
educationClassifyListApi({sn: this.dataSn}).then(result => {
this.classifyList = result.result;
})
},
addClassifyFn(){
this.dialogVisible=true;
this.classifyForm.classifyName=''
},
editClassifyFn(){},
deleteClassifyFn(item){
this.$confirm(this.$t('message.personnelPosition.beaconManage.table.confirmText') + "【" + item.classifyName + "】?", this.$t('message.personnelPosition.beaconManage.table.Tips'), {
confirmButtonText: this.$t('message.personnelPosition.confirmButtonText'),
cancelButtonText: this.$t('message.personnelPosition.cancelButtonText'),
type: "warning",
}).then(() => {
educationClassifyDeleteApi({id: item.id}).then(result => {
if (result.success) {
this.$message.success(result.message);
if(item.id==this.parentId){
this.parentId=''
this.getList();
}
this.getClassifyList();
}
})
})
},
saveClassifyFn(){
this.$refs['addEditForm'].validate((valid) => {
if (valid) {
educationClassifyAddApi({
sn: this.dataSn,
classifyName: this.classifyForm.classifyName,
type:this.activeName=='company'?1:2
}).then(result => {
this.dialogVisible = false;
this.$message.success(result.message);
this.getClassifyList();
})
} else {
console.log('error submit!!');
return false;
}
educationClassifyListApi({ sn: this.dataSn }).then((result) => {
this.classifyList = result.result;
console.log('课程分类', this.classifyList);
});
}
},
addClassifyFn() {
this.dialogVisible = true;
this.classifyForm.classifyName = "";
},
editClassifyFn() {},
deleteClassifyFn(item) {
this.$confirm(
this.$t("message.personnelPosition.beaconManage.table.confirmText") +
"【" +
item.classifyName +
"】?",
this.$t("message.personnelPosition.beaconManage.table.Tips"),
{
confirmButtonText: this.$t(
"message.personnelPosition.confirmButtonText"
),
cancelButtonText: this.$t(
"message.personnelPosition.cancelButtonText"
),
type: "warning",
}
).then(() => {
educationClassifyDeleteApi({ id: item.id }).then((result) => {
if (result.success) {
this.$message.success(result.message);
if (item.id == this.parentId) {
this.parentId = "";
this.getList();
}
this.getClassifyList();
}
});
});
},
saveClassifyFn() {
this.$refs["addEditForm"].validate((valid) => {
if (valid) {
educationClassifyAddApi({
sn: this.dataSn,
classifyName: this.classifyForm.classifyName,
type: this.activeName == "company" ? 1 : 2,
}).then((result) => {
this.dialogVisible = false;
this.$message.success(result.message);
this.getClassifyList();
});
} else {
console.log("error submit!!");
return false;
}
});
},
},
};
</script>
<style lang="less" scoped>
.backText {
margin: -10px 0 0 0;
}
.jyjzPage .backText{
.jyjzPage .backText {
margin: 15px 15px 0;
/deep/.el-page-header__content{
/deep/.el-page-header__content {
color: white;
}
}
@ -341,7 +441,7 @@ export default {
float: left;
width: 20%;
height: 250px;
margin-bottom: 20px;
margin-bottom: 20px;
.inner {
margin: 0 10px;
box-shadow: 0px 2px 16px 0px rgba(131, 183, 255, 0.2);
@ -349,7 +449,7 @@ export default {
overflow: hidden;
position: relative;
}
.mask{
.mask {
position: absolute;
left: 0;
top: 0;
@ -368,8 +468,8 @@ export default {
.videoBox {
position: relative;
overflow: hidden;
&:hover{
.mask{
&:hover {
.mask {
transform: translateY(0);
}
}
@ -396,33 +496,33 @@ export default {
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
&:hover{
color: @--color-primary;
&:hover {
color: @--color-primary;
}
}
&:hover{
.deleteBtn{
display: block;
&:hover {
.deleteBtn {
display: block;
}
}
.deleteBtn{
display: none;
position: absolute;
right: 10px;
bottom: 10px;
cursor: pointer;
.deleteBtn {
display: none;
position: absolute;
right: 10px;
bottom: 10px;
cursor: pointer;
}
}
.pagerBox {
margin: 20px;
}
.table_wrap{
.table_wrap {
position: relative;
height: calc(100% - 98px - 50px);
}
.classificationBox{
.classificationBox {
margin: 20px;
span{
span {
margin-right: 30px;
cursor: pointer;
display: inline-block;
@ -430,16 +530,17 @@ export default {
border-radius: 3px;
padding: 3px 10px;
position: relative;
&.active,&:hover{
&.active,
&:hover {
background-color: @--color-primary-deep;
color: white;
}
&:hover{
.el-icon-error{
&:hover {
.el-icon-error {
display: block;
}
}
.el-icon-error{
.el-icon-error {
color: salmon;
position: absolute;
right: -8px;
@ -448,10 +549,10 @@ export default {
display: none;
}
}
.addTypeBtn{
.addTypeBtn {
border: 1px solid @--color-primary-deep;
color: @--color-primary-deep;
i{
i {
margin-right: 8px;
}
}