实训设计列表功能

This commit is contained in:
dong 2022-08-18 15:35:10 +08:00
parent fda477c08b
commit b3652b84b0
6 changed files with 456 additions and 1 deletions

58
src/api/trainingManage.js Normal file
View File

@ -0,0 +1,58 @@
import request from '@/utils/request';
/** 获取当前用户的所有实训草稿数据 */
export function getAllTrainingList(params) {
return request({
url: `/api/v2/draft/training/all`,
method: 'get',
params
});
}
/** 分页获取当前用户的实训草稿数据 */
export function getTrainingList(data) {
return request({
url: `/api/v2/draft/training/info/page`,
method: 'post',
data
});
}
/** 创建实训草稿 */
export function createTraining(data) {
return request({
url: `/api/v2/draft/training/create`,
method: 'post',
data
});
}
/** 更新当前用户的某个实训草稿 */
export function updateTraining(data) {
return request({
url: `/api/v2/draft/training`,
method: 'post',
data
});
}
/** 修改实训所有步骤 */
export function updateTrainingStep(id, data) {
return request({
url: ` /api/v2/draft/training/${id}/step/update`,
method: 'put',
data: data
});
}
/** 删除当前用户的实训草稿 */
export function deleteTraining(data) {
return request({
url: `/api/v2/draft/training`,
method: 'delete',
data: {trainingDraftIds: data}
});
}
/** 当前用户发布自己的实训草稿 */
export function publishTraining(data) {
return request({
url: `/api/v2/draft/training/publish`,
method: 'post',
data
});
}

View File

@ -253,6 +253,10 @@ export default {
{ label: 'S', value: 'S' },
{ label: 'SF', value: 'SF' },
{ label: 'SD', value: 'SD' }
],
trainingType: [ // 实训类型
{ enlabel: 'single operation', label: '单操', value: 'single'},
{ enlabel: 'scene operation', label: '场景', value: 'scene'}
]
}
};

View File

@ -2,6 +2,7 @@
<div class="train">
<div v-show="maskOpen" class="trainMask" />
<jlmap-visual ref="jlmapVisual" />
<menu-demon ref="menuDemon" />
<voice-chat-box v-if="$route.query.lineCode == '16'" ref="chatbox" :group="group" :user-role="userRole" />
<chat-box v-else ref="chatbox" :group="group" :user-role="userRole" />
<div class="trainBack">
@ -19,11 +20,12 @@ import { creatSubscribe, clearSubscribe, displayTopic} from '@/utils/stomp';
import { getToken } from '@/utils/auth';
import chatBox from '@/views/newMap/chatView/chatBox.vue';
import VoiceChatBox from '@/views/newMap/chatView/voiceChatBox.vue';
import MenuDemon from '@/views/trainingManage/demonMenu.vue';
export default {
name: 'TrainingDesign',
components: {
JlmapVisual,
MenuDemon,
chatBox,
VoiceChatBox
},

View File

@ -0,0 +1,122 @@
<template>
<el-dialog :title="title" :visible.sync="dialogVisible" width="500px" :modal="false" :before-close="doClose" center>
<data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doCreate">{{ $t('global.confirm') }}</el-button>
<el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { createTraining, updateTraining } from '@/api/trainingManage';
import ConstConfig from '@/scripts/ConstConfig';
export default {
name: 'Create',
props: {},
data() {
return {
dialogVisible: false,
isCreate: true,
formModel: {
name: '',
mapId: '',
description:'',
type: '',
labelJson: ''
}
};
},
computed: {
title() {
let t = '新建实训';
if (!this.isCreate) {
t = '编辑实训';
}
return t;
},
form() {
const form = {
labelWidth: '60px',
items: [
{ prop: 'name', label: '名称', type: 'text' },
{ prop: 'description', label: '描述', type: 'textarea' },
{ prop: 'type', label: '类型', type: 'select', options: ConstConfig.ConstSelect.trainingType },
{ prop: 'labelJson', label: '标签', type: 'text' }
]
};
return form;
},
rules() {
const crules = {
name: [
{ required: true, validator: this.validateName, trigger: 'blur' }
],
description: [
{ required: true, validator: this.validateDescription, trigger: 'blur' }
],
type: [
{ required: true, message: '请选择实训类型', trigger: 'blur' }
]
};
return crules;
}
},
methods: {
validateName(rule, value, callback) {
if (value.trim().length == 0) {
this.formModel.name = this.formModel.name.replace(/\s/g, '');
return callback(new Error('请输入实训名称'));
} else {
return callback();
}
},
validateDescription(rule, value, callback) {
if (value.trim().length == 0) {
this.formModel.description = this.formModel.description.replace(/\s/g, '');
return callback(new Error('请输入实训描述'));
} else {
return callback();
}
},
doShow(data) {
if (data) {
this.isCreate = false;
this.formModel = {...data};
} else {
this.isCreate = true;
this.formModel = {
name: '',
mapId: this.$route.query.mapId,
description:'',
type: '',
labelJson: ''
};
}
this.dialogVisible = true;
},
doCreate() {
this.$refs.dataform.validateForm(async() => {
if (this.isCreate) {
await createTraining(this.formModel);
} else {
await updateTraining(this.formModel);
}
this.$emit('edit');
this.doClose();
});
},
doClose() {
this.$refs.dataform.resetForm();
this.dialogVisible = false;
}
}
};
</script>
<style lang="scss" scoped>
/deep/ .el-dialog--center .el-dialog__body{
padding: 25px 65px 30px 10px;
}
</style>

View File

@ -0,0 +1,86 @@
<template>
<div>
<div class="display_top_draft">
<div class="btn_hover" @click="menuClick">菜单</div>
<el-button-group ref="button_group_box" class="button_group_box" :style="`margin-left:${btnWidth}px`">
<el-button size="small" @click="showList">实训列表</el-button>
</el-button-group>
</div>
<TrainingList ref="trainingList" />
</div>
</template>
<script>
import TrainingList from './trainingList.vue';
export default {
name:'DemonMenu',
components:{
TrainingList
},
props:{
},
data() {
return {
hoverBtn: false,
btnWidth: -600
};
},
computed:{
group() {
return this.$route.query.group;
},
mapId() {
return this.$route.query.mapId;
},
lineCode() {
return this.$route.query.lineCode;
}
},
mounted() {
},
methods:{
menuClick() {
this.hoverBtn = !this.hoverBtn;
if (this.hoverBtn) {
this.btnWidth = 0; //
} else {
this.btnWidth = -600;
}
},
showList() {
this.$refs.trainingList.doShow();
}
}
};
</script>
<style lang="scss" scoped>
.display_top_draft{
position: absolute;
left: 5px;
top: 15px;
height: 32px;
overflow: hidden;
padding-left: 44px;
z-index: 35;
.btn_hover{
position: absolute;
left: 0;
top: 0;
z-index: 2;
color: #4e4d4d;
font-size: 14px;
background: #fff;
padding: 8px;
border-radius: 5px;
display: block;
cursor: pointer;
float: left;
height: 32px;
}
.button_group_box{
float: left;
transition: all 0.5s;
overflow: hidden;
}
}
</style>

View File

@ -0,0 +1,183 @@
<template>
<el-dialog v-dialogDrag title="实训管理" :visible.sync="dialogVisible" width="1000px" :before-close="doClose" center>
<div>
<div class="scriptHeader">
<div class="scriptList">实训草稿列表</div>
<div class="flexNull" />
<el-button size="small" type="primary" class="createScript" @click="handleCreate">{{ $t('scriptRecord.scriptCreate') }}</el-button>
</div>
<QueryListPage ref="queryListPage" :card-padding="10" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
<Create ref="create" v-dialogDrag @edit="getListData" />
</div>
</el-dialog>
</template>
<script>
import { getTrainingList} from '@/api/trainingManage';
import Cookies from 'js-cookie';
import ConstConfig from '@/scripts/ConstConfig';
import Create from './create.vue';
import { deleteTraining, publishTraining } from '@/api/trainingManage';
import { admin, superAdmin} from '@/router/index';
export default {
name: 'TrainingList',
components:{
Create
},
props: {},
data() {
return {
dialogVisible: false,
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '100px',
reset: true,
show:false
},
queryList: {
query: this.queryFunction,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: '实训名称',
prop: 'name'
},
{
title: '描述',
prop: 'description'
},
{
title: '类型',
prop: 'type',
type: 'tag',
columnValue: (row) => { return this.covertData(row); },
tagType: (row) => { return ''; }
},
{
title: '标签',
prop: 'labelJson'
},
{
type: 'button',
title: this.$t('scriptRecord.operate'),
width: '450',
buttons: [
{
name: this.$t('scriptRecord.scriptRecord'),
handleClick: this.drawUp,
type: 'success',
showControl:(row) => { return row.id; }
},
{
name: this.$t('scriptRecord.scriptModify'),
handleClick: this.handleModify,
type: 'primary',
showControl:(row) => { return row.id; }
},
{
name: this.$t('scriptRecord.scriptDelete'),
handleClick: this.deleteScript,
type: 'danger',
showControl:(row) => { return row.id; }
},
{
name: this.$t('scriptRecord.publish'),
handleClick: this.publishScript,
type: 'primary',
showControl:(row) => { return row.id; }
}
]
}
]
}
};
},
computed: {
},
methods: {
queryFunction(params) {
return getTrainingList(params);
},
doShow() {
this.getListData();
this.dialogVisible = true;
},
doClose() {
this.dialogVisible = false;
},
handleCreate() {
this.$refs.create.doShow(null);
},
covertData(row) {
const releaseReview = ConstConfig.ConstSelect.trainingType;
const lastData = Object.assign({}, row);
if (Cookies.get('user_lang') == 'en') {
releaseReview.forEach(function(element) {
const rolename = element.value;
if (lastData.type == rolename) {
lastData.type = element.enlabel;
}
});
} else {
releaseReview.forEach(function(element) {
const rolename = element.value;
if (lastData.type == rolename) {
lastData.type = element.label;
}
});
}
return lastData.type;
},
drawUp(index, row) {
console.log('编辑', index, row);
},
handleModify(index, row) {
console.log('修改', index, row);
if (!row.id) { return; }
this.$refs.create.doShow(row);
},
deleteScript(index, row) {
console.log('删除', index, row);
if (!row.id) { return; }
deleteTraining([row.id]).then(res => {
console.log('删除实训成功', res);
this.getListData();
}).catch(err => {
console.log('删除实训失败', err);
this.getListData();
});
},
publishScript(index, row) {
console.log('发布', index, row);
if (!row.id) { return; }
publishTraining({draftId: row.id}).then(res => {
console.log('发布实训成功', res);
}).catch(err => {
console.log('发布实训失败', err);
});
},
getListData() {
this.$refs.queryListPage && this.$refs.queryListPage.commitQuery();
}
}
};
</script>
<style lang="scss" scoped>
/deep/ .el-dialog--center .el-dialog__body{
padding: 10px 25px 10px 25px;
}
.scriptHeader {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 5px;
.flexNull {
flex: 1;
}
}
</style>