This commit is contained in:
fan 2021-05-17 13:37:03 +08:00
commit 5215d8ba2c
23 changed files with 2959 additions and 1696 deletions

33
src/api/pdf.js Normal file
View File

@ -0,0 +1,33 @@
import request from '@/utils/request';
/** 创建分组 */
export function postUploadFile(data) {
return request({
url: `/api/file`,
method: 'post',
data
});
}
// 查询
export function getUploadFile(params) {
return request({
url: `/api/file`,
method: 'get',
params: params
});
}
// 修改
export function putUploadFile(data) {
return request({
url: `/api/file`,
method: 'put',
data
});
}
// 删除
export function deleteUploadFile(data) {
return request({
url: `/api/file`,
method: 'delete'
});
}

View File

@ -3,10 +3,10 @@ import request from '@/utils/request';
export const productIdentify = '00001&appSecret=joylink00001';
export const pictureUrl = `/api/upload/PICTURE?appId=${productIdentify}`;
// export const modelUrl = `/api/upload/model?appId=${productIdentify}`;
// export const modelUrl = `/api/file?appId=${productIdentify}`;
// export const attachmentUrl = `/api/upload/attachment?appId=${productIdentify}`;
// export const meansUrl = `/api/upload/means?appId=${productIdentify}`;
export const meansUrl = `/api/upload/MEANS?appId=${productIdentify}`;
// export const regulationUrl = `/api/upload/regulation?appId=${productIdentify}`;
export function getUrl(relatedUrl) {

View File

@ -353,13 +353,45 @@
</el-form-item>
</template>
<template v-else-if="checkFieldType(item, 'uploadPicture')">
<el-form-item v-show="item.show" :key="item.prop" :prop="item.prop" :label="item.label" :required="item.required">
<el-upload
class="upload-demo"
:action="item.action"
:on-success="item.onSuccess"
:http-request="item.uploadFile"
:on-change="item.onChange"
:limit="1"
:file-list="item.fileList"
>
<el-button size="small" type="primary">点击上传</el-button>
<!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件且不超过500kb</div> -->
</el-upload>
</el-form-item>
<!-- <el-form-item prop="imageUrl" /> -->
<!-- <picture-card
ref="upload"
v-model="fileList"
:action="action"
scope="file"
@disabled="onDisabled"
>
<div slot class="tips">请上传文件</div>
</picture-card> -->
</template>
</template>
</el-form>
</template>
<script>
// import PictureCard from '@/components/UploadFiles/picture-card';
export default {
name: 'DataForm',
components: {
// PictureCard
},
props: {
form: {
type: Object,

View File

@ -0,0 +1,136 @@
<template>
<div>
<el-upload
ref="upload"
list-type="picture-card"
:action="action"
:file-list="fileList"
:multiple="multiple"
:auto-upload="auto"
:limit="limit"
:http-request="uploadFile"
:on-change="onChange"
:on-remove="onRemove"
:on-exceed="onExceed"
:on-preview="pictureCardPreview"
>
<i class="el-icon-plus" />
<slot name="trigger" />
</el-upload>
<slot />
<el-dialog :visible.sync="dialogVisible" :modal="false">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</div>
</template>
<script>
export default {
props: {
auto: {
type: Boolean,
default: false
},
multiple: {
type: Boolean,
default: false
},
action: {
type: String,
required: true
},
value: {
type: Array,
required: true
},
limit: {
type: Number,
default: 1
},
scope: {
type: String,
default: 'files'
},
extra: {
type: Object,
default() {
return {};
}
}
},
data() {
return {
fileList: [],
formData: '',
dialogVisible: false,
dialogImageUrl: ''
};
},
watch: {
value(val) {
this.fileList = val;
}
},
methods: {
onChange(file, fileList) {
this.fileList = fileList;
this.$emit('value', [...this.fileList]);
this.$emit('disabled', fileList.every(el => el.status == 'success'));
},
onRemove(file, fileList) {
this.fileList = fileList;
this.$emit('value', [...this.fileList]);
this.$emit('disabled', fileList.every(el => el.status == 'success'));
},
clearFiles() {
this.$refs.upload.clearFiles();
this.fileList = [];
this.$emit('value', [...this.fileList]);
this.$emit('disabled', true);
},
onExceed(files, fileLis) {
this.$message.info(`超出文件上传限制,限制${this.limit}个。`);
},
pictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
uploadFile(file) {
this.formData.append(this.scope, file.file);
},
submit(upload) {
return new Promise((resolve, reject) => {
if (this.fileList.length) {
var isUpload = this.fileList.every(file => file.status == 'ready');
var isLt100M = this.fileList.every(file => file.size / 1024 / 1024 < 100);
if (!isUpload) {
reject({message: '没有需要上传的文件'});
} else if (!isLt100M) {
reject({message: '请检查上传文件大小不能超过100MB!'});
} else {
this.formData = new FormData();
this.$refs.upload.submit();
Object.keys(this.extra).forEach(key => { this.formData.append(key, this.extra[key]); });
upload(this.action, this.formData)
.then(resp => { resolve(resp); })
.catch(error => { reject(error); });
}
} else {
resolve();
}
});
}
}
};
</script>
<style lang="scss" scoped>
/deep/ {
.el-upload-list--picture-card .el-upload-list__item {
margin: 0 6px 0 0 !important;
}
}
</style>

View File

@ -7,6 +7,7 @@ export default {
newDesignEditor: '编辑器',
newDesignEditorList: '图文列表',
newDesignDraftEditorList: '文章草稿',
uploadPdf: 'PDF上传',
mapManage: '地图管理',
skinManage: '皮肤管理',

View File

@ -30,8 +30,8 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
let scope = this;
this.dom = dom;
//定义相机
//定义当前课程角色
let nowRole = "";
//定义场景(渲染容器)
scene = new THREE.Scene();
@ -53,7 +53,6 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
animateManager.initAnimation(assetModelManager);
controlManager.init(animateManager.actions);
console.log(lessonData.lessonProgress[lessonIndex]);
if(lessonData.lessonProgress[lessonIndex].action.length>0){
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action,assetModelManager.lessonTriggerList);
}
@ -75,12 +74,27 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
this.changeIndex = function(nowIndex){
lessonIndex = nowIndex;
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action);
if(lessonData.lessonProgress[lessonIndex].roleName == nowRole){
controlManager.initRoleMode(true);
}else{
controlManager.initRoleMode(false);
}
}
this.changeCameraPos = function(pos){
controlManager.updatePos(pos);
}
this.initNowRole = function(role){
nowRole = role;
if(lessonData.lessonProgress[lessonIndex].roleName == nowRole){
controlManager.initRoleMode(true);
}else{
controlManager.initRoleMode(false);
}
};
//循环渲染函数
function animate() {

View File

@ -13,12 +13,10 @@ export function AnimateManager() {
for(let k in assetModelManager.staticAsset){
if(assetModelManager.staticAsset[k].mesh.animations.length > 0){
console.log(assetModelManager.staticAsset[k].mesh.name);
let animations = assetModelManager.staticAsset[k].mesh.animations;
let mixer = new THREE.AnimationMixer( assetModelManager.staticAsset[k].mesh );
let actionName = assetModelManager.staticAsset[k].mesh.name;
console.log(actionName);
scope.actions[actionName] = {
status:"01",
action:mixer.clipAction( assetModelManager.staticAsset[k].mesh.animations[ 0 ])
@ -38,7 +36,6 @@ export function AnimateManager() {
for(let i=mixers.length-1;i>=0;i--){
if(mixers[i]._actions[0].isRunning()){
// console.log(scope.mixers[i]._actions[0].isRunning());
mixers[i].update( mixerUpdateDelta );
}
}

View File

@ -198,7 +198,6 @@ export function AssetModelManager(scene) {
function fbxpromise(asset){
return new Promise(function(resolve, reject){
var loader = new THREE.FBXLoader();
console.log(asset);
if(asset.assetType == "static"){
loader.load( asset.url, function ( object ) {
object.name = asset.modelId;
@ -210,7 +209,6 @@ export function AssetModelManager(scene) {
loader.load( BASE_ASSET_API+asset.url, function ( object ) {
asset.mesh = object;
if(asset.assetType == "default"){
console.log(object);
// scene.add(object);
}else if(asset.assetType == 'loadModel'){

View File

@ -14,6 +14,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
this.nowCamera = null;
this.eventHitMode = false;
let roleMode = false;
let eventBoxs = [];
let raycasterBoxs = [];
let actionList = [];
@ -110,6 +111,9 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
}
);
this.initRoleMode = function(rMode){
roleMode = rMode;
};
const worldOctree = new Octree();
@ -138,6 +142,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
const keyStates = {};
let clock = new THREE.Clock();
this.updateOrbitControl = function(){
oribitControl.update();
};
@ -151,7 +156,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
updateSpheres( deltaTime );
if(scope.eventHitMode == true){
if(scope.eventHitMode == true && roleMode){
if(eventBoxs.length>0){
attachBox.position.copy(fpsCamera.position);
for(let i=0;i<eventBoxs.length;i++){
@ -231,7 +236,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
fpsMouseStatus = true;
// document.body.requestPointerLock();
if(raycasterBoxs.length>0){
if(raycasterBoxs.length>0 && roleMode){
var mouse = new THREE.Vector2();
var raycaster = new THREE.Raycaster();
@ -479,7 +484,6 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
if(actions[i].actionMode == "play"){
for(let j=0;j<eventTrigger.length;j++){
if(eventTrigger[j].label == actions[i].actionModel){
console.log(actionList);
if(actionList[eventTrigger[j].actionName].status == "01"){
actionList[eventTrigger[j].actionName].status = "02";
@ -494,8 +498,6 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
for(let j=0;j<eventTrigger.length;j++){
if(eventTrigger[j].label == actions[i].actionModel){
let eventTestBox = new THREE.Box3(new THREE.Vector3(), new THREE.Vector3());
eventTestBox.setFromObject(eventTrigger[j]);

View File

@ -9,6 +9,10 @@ export function LessonData() {
this.lessonData = {
//资源列表
assetList:[],
setup:{
examMode:"",
checkedRole:"",
},
//场景交互物体列表
modelList:[],
//课程组件启用状态
@ -61,6 +65,8 @@ export function LessonData() {
tittle:"标题",
picurl:"url",
text:"内容",
explainPaneType:"null",
nextNode:"",
},
action:[],
};
@ -141,6 +147,8 @@ export function LessonData() {
tittle:"标题",
picurl:"url",
text:"内容",
explainPaneType:"null",
nextNode:"",
},
action:[

View File

@ -177,6 +177,8 @@ const Ueditor = () => import('@/views/editor/index');
const UeditorList = () => import('@/views/editor/list');
const UeditorDraftList = () => import('@/views/editor/listDraft');
const UploadPdfList = () => import('@/views/uploadPdf/list');
// import { GenerateRouteProjectList } from '@/scripts/ProjectConfig';
// import { getSessionStorage } from '@/utils/auth';
@ -1176,6 +1178,23 @@ export const asyncRouter = [
}
]
},
{
path: '/uploading',
component: Layout,
meta: {
i18n: 'router.uploadPdf',
roles: [admin, user]
},
children: [
{
path: 'list',
component: UploadPdfList,
meta: {
i18n: 'router.uploadPdf'
}
}
]
},
{ // 新个人地图
path: '/design',
component: Layout,

View File

@ -169,6 +169,17 @@
<el-input v-model="selected.text" ></el-input>
</el-form-item>
<el-form-item label="提示功能:" v-if="selected.explainPaneType">
<el-select v-model="selected.explainPaneType" placeholder="请选择">
<el-option
v-for="explainType in explainPaneTypes"
:key="explainType.value"
:label="explainType.name"
:value="explainType.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="说明画面:" v-if="selected.picurl">
<el-input v-model="selected.picurl" ></el-input>
</el-form-item>
@ -295,6 +306,16 @@
],
jobDataList:[],
value:'',
explainPaneTypes:[
{
name:"无",
value:"null",
},
{
name:"跳转",
value:"jump",
}
],
}
},
computed: {

View File

@ -7,6 +7,34 @@
:lessonTools='lessonTools'
></LessonTools-Manager>
<div id="" class="lessonsetupdiv" v-show="showSetup">
<div style="text-align:center;top:10%;font-size:30px">课程内容设置</div>
<el-form ref="form" label-width="80px">
<el-form-item label="考试模式">
<el-switch
v-model="examMode"
active-text="开启考试模式"
inactive-text="关闭考试模式">
</el-switch>
</el-form-item>
<el-form-item label="可用角色">
<el-checkbox-group v-model="checkedRole">
<el-checkbox v-for="role in jobPaneData.dataList" :label="role.name" :key="role.name">{{role.name}}</el-checkbox>
</el-checkbox-group>
</el-form-item>
<!-- <el-form-item label="课程简介">
<el-input type="textarea" v-model="form.desc"></el-input>
</el-form-item> -->
<el-form-item>
<el-button type="primary" @click="onSubmit">修改完成</el-button>
<el-button @click="unSubmit" >关闭</el-button>
</el-form-item>
</el-form>
</div>
<div class="lesson3dedit">
<Step-Tips
:lessonData='lessonData'
@ -50,7 +78,6 @@
</Lesson-Progress>
<div class="lessonsetup" >
<el-row>
当前课程信息
</el-row>
@ -118,6 +145,9 @@
data() {
return {
jl3d: null,
showSetup:false,
examMode:false,
checkedRole:[],
netData:{
name:'',
type:'',
@ -186,9 +216,10 @@
if(data.data.data){
loadData = JSON.parse(data.data.data);
console.log(loadData);
this.checkedRole = loadData.setup.checkedRole;
this.examMode = loadData.setup.examMode;
this.jobPaneData.dataList = loadData.toolJobPane;
console.log(this.jobPaneData.dataList);
this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
this.lessonTools = loadData.lessonTools;
@ -197,8 +228,7 @@
this.lessonData.initLessonProgress();
this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
}
console.log("loaddata----------------");
console.log(loadData);
this.jl3d = new Lesson3dEditor(dom,loadData);
}).catch(() => {
});
@ -212,13 +242,15 @@
let assetModelData = this.jl3d.saveAssetModel();
saveData.assetList = assetModelData.assetList;
saveData.modelList = assetModelData.modelList;
saveData.setup.examMode = this.examMode;
saveData.setup.checkedRole = this.checkedRole;
this.netData.data = JSON.stringify(saveData);
// console.log();
updateLesson3dData(this.$route.query.lessonId,this.netData).then(data => {
console.log(data);
}).catch(() => {
this.$message('保存成功');
}).catch(() => {
this.$message('保存失败');
});
},
addProgress(){
@ -245,6 +277,7 @@
},
setupclick(){
this.showSetup = true;
},
createModel(assetData,mousePos){
this.jl3d.createModelTrigger(assetData,mousePos);
@ -258,6 +291,13 @@
this.$router.push({ path: '/design/jlmap3d/lesson3dplayer', query: {lessonId: this.$route.query.lessonId} });
},
onSubmit() {
this.showSetup = false;
},
unSubmit(){
this.showSetup = false;
},
},
}
@ -318,4 +358,25 @@
.el-tabs__content{
position: absolute;
}
.lessonsetupdiv {
position: absolute;
width: 30%;
height: 40%;
top:30%;
left:35%;
background-color: #fff;
border-radius: 18px;
border:solid 2px #000;
z-index: 5;
}
.nextbuttondiv{
width:30px;
height:30px;
background-size: 100%;
position: absolute;
right:0;
bottom:0;
}
</style>

View File

@ -9,6 +9,11 @@
<div class="explainpanetext" >
{{lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.text}}
</div>
<div class="nextbuttondiv"
:style="{'background-image': 'url('+staticImg+'/lesson3d/nextbutton.png)'}"
v-if="lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.explainPaneType=='jump'"></div>
</div>
</template>
<script>
@ -26,6 +31,7 @@
data() {
return {
localStatic:BASE_ASSET_API,
staticImg:JL3D_LOCAL_STATIC,
}
},
computed: {
@ -61,6 +67,7 @@
border-radius:10px;
border:solid 2px #000;
background-color: #fff;
color:#000;
z-index:1;
}
.explainpanetittle{
@ -70,15 +77,28 @@
}
.explainpanepic{
height:65%;
position:relative;
width:90%;
left:5%;
height:45%;
border:solid 2px #000;
background-size: 100%;
}
.explainpanetext{
position:relative;
left:5%;
width:90%;
font-size: 14px;
// height:20%;
}
.nextbuttondiv{
width:30px;
height:30px;
background-size: 100%;
position: absolute;
right:0;
bottom:0;
}
</style>

View File

@ -2,6 +2,21 @@
<div id="lesson3ddiv" class="lesson3ddiv">
<div class="selectjobdiv"
:style="{'background-image': 'url('+staticImg+'/texture/bg.jpg)'}"
v-if="showSelectJob">
<div class="selectjobbuttondiv">
<div
class="selectjobimg"
v-for="(job,index) in selectJobList"
@click="selectJob(job)"
:style="{'background-image': 'url('+staticImg+'/lesson3d/mst.png)'}">
<!-- <div>{{job}}</div> -->
<div style="width:100%;position:absolute;bottom:0;font-size:30px;textAlign:center;">{{job}}</div>
</div>
</div>
</div>
<div class="lesson3dplayer">
<Step-Tips
:lessonData='lessonData'
@ -19,13 +34,16 @@
<Explain-Pane
:lessonData='lessonData'
:lessonPlayIndex='lessonPlayIndex'
v-show="lessonTools[2].isShow && lessonData.lessonData.lessonProgress[lessonPlayIndex].progressScene == 'standstation'">
:nowRole ='nowRole'
v-show="lessonTools[2].isShow && lessonData.lessonData.lessonProgress[lessonPlayIndex].progressScene == 'standstation'"
@jumpEvent="jumpEvent">
</Explain-Pane>
<Job-Pane
:jobPaneData='jobPaneData'
:lessonData='lessonData'
:lessonPlayIndex='lessonPlayIndex'
:nowRole='nowRole'
ref="jobpane"
v-show="lessonTools[3].isShow && lessonData.lessonData.lessonProgress[lessonPlayIndex].progressScene == 'standstation'">
</Job-Pane>
@ -62,6 +80,9 @@
import { JobPaneData } from '@/jlmap3d/lesson3d/toolsmodel/jobpanedata.js';
import { getLesson3dData,updateLesson3dData } from '@/api/jmap/lesson3d';
import { JL3D_LOCAL_STATIC,BASE_ASSET_API } from '@/api/jlmap3d/assets3d.js';
export default {
name: 'Lesson3dPlayer',
components: {
@ -76,6 +97,10 @@
},
data() {
return {
staticImg:JL3D_LOCAL_STATIC,
showSelectJob:true,
selectJobList:[],
nowRole:"",
jl3d: null,
netData:{
name:'',
@ -146,7 +171,7 @@
let loadData;
if(data.data.data){
loadData = JSON.parse(data.data.data);
this.selectJobList = loadData.setup.checkedRole;
this.jobPaneData.dataList = loadData.toolJobPane;
this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
@ -163,6 +188,17 @@
}).catch(() => {
});
},
selectJob(job){
this.showSelectJob = false;
for(let i=0;i<this.jobPaneData.dataList.length;i++){
if(job == this.jobPaneData.dataList[i].name){
this.nowRole = this.jobPaneData.dataList[i].value;
console.log(this.nowRole);
this.jl3d.initNowRole(this.nowRole);
}
}
},
startLesson(){
this.$refs.processlog.startLog();
},
@ -190,6 +226,9 @@
if(type == "tools"){
this.lessonPlayIndex = action.nextNode;
}
if(type == "jump"){
this.lessonPlayIndex = action.nextNode;
}
console.log(type);
console.log(action);
this.jl3d.changeIndex(this.lessonPlayIndex);
@ -219,6 +258,40 @@
touch-action: none;
}
.selectjobdiv{
width:100%;
height:100%;
position: absolute;
z-index: 5;
background-size: 100%;
}
.selectjobimg{
width:250px;
height:250px;
background-size: 100%;
// float:left;
display: inline-block;
position:relative;
}
.selectjobbuttondiv{
position:absolute;
width:80%;
height:30%;
left:10%;
top:35%;
overflow-x:scroll;
overflow-y:hidden;
text-align: center;
}
.selectjobbackdiv{
}
.lesson3ddiv {
width: 100%;
@ -266,4 +339,5 @@
.el-tabs__content{
position: absolute;
}
</style>

View File

@ -1,7 +1,7 @@
<template>
<div class="explainpanediv"
v-if="lessonData.lessonData.lessonProgress[lessonPlayIndex]"
@click="selectTool"
:style="{'background-image': 'url('+lessonbg+')'}">
<div class="explainpanetittle" >
{{lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.tittle}}
@ -12,6 +12,10 @@
<div class="explainpanetext" >
{{lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.text}}
</div>
<div class="nextbuttondiv"
:style="{'background-image': 'url('+staticImg+'/lesson3d/nextbutton.png)'}"
v-if="lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.explainPaneType=='jump' "
@click="explainJump"></div>
</div>
</template>
<script>
@ -22,13 +26,14 @@
export default {
name: 'ExplainPane',
props:['lessonData','lessonPlayIndex'],
props:['lessonData','lessonPlayIndex','nowRole'],
components: {
},
data() {
return {
localStatic:BASE_ASSET_API,
staticImg:JL3D_LOCAL_STATIC,
lessonbg:JL3D_LOCAL_STATIC+"/lesson3d/lessonbg.png",
}
},
@ -45,8 +50,13 @@
},
methods: {
selectTool(){
lesson3dSelect('toolproperty','explainpane');
// selectTool(){
// lesson3dSelect('toolproperty','explainpane');
// },
explainJump(){
if(this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].explainPane.explainPaneType == "jump"){
this.$emit('jumpEvent','jump',this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].explainPane);
}
},
},
@ -77,7 +87,7 @@
position:relative;
width:90%;
left:5%;
height:65%;
height:45%;
border:solid 2px #000;
background-size: 100%;
}
@ -90,5 +100,13 @@
// height:20%;
}
.nextbuttondiv{
width:30px;
height:30px;
background-size: 100%;
position: absolute;
right:0;
bottom:0;
}
</style>

View File

@ -48,7 +48,7 @@
//
export default {
name: 'JobPane',
props:['jobPaneData','lessonData','lessonPlayIndex'],
props:['jobPaneData','lessonData','lessonPlayIndex','nowRole'],
components: {
@ -98,7 +98,8 @@
console.log(selectTool);
let nowProgress = this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex];
console.log(nowProgress.id);
if(selectTool.sceneId == nowProgress.id){
console.log(this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex]);
if(selectTool.sceneId == nowProgress.id && this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].roleName == this.nowRole){
jumpEvent("tools",selectTool);
}
// console.log(this.lessonData.lessonProgress[this.lessonPlayIndex]);

View File

@ -0,0 +1,251 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" center class="uploadDialog">
<data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
<el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { postUploadFile, putUploadFile } from '@/api/pdf';
import { getPublishMapDetailById, getPublishMapVersionById } from '@/api/jmap/map';
import { dbReadData, dbAddData, dbUpdateData } from '@/utils/indexedDb';
// uploadFile
import { meansUrl } from '@/api/upload';
export default {
name: 'TrainingDetailEdit',
props: {
type: {
type: String,
required: true
},
mapList:{
type: Array,
required: true
}
},
data() {
return {
dialogVisible: false,
formModel: {
// cityCode: '',
mapId: '',
deviceTypes: '',
deviceIds: [],
upload: '',
filePath: '',
fileType: 'DRAWING'
},
rowData: null,
graphDataNew: null,
fileList: [],
formData: '',
id: '',
deviceTypeList: [
{ label: '区段', value: 'sectionList', code: 'SECTION' },
{ label: '道岔', value: 'switchList', code: 'SWITCH' },
{ label: '信号机', value: 'signalList', code: 'SIGNAL' },
{ label: '车站', value: 'stationList', code: 'STATION' },
{ label: '站台', value: 'stationStandList', code: 'STAND' },
{ label: '屏蔽门', value: 'psdList', code: 'PSD' },
{ label: '列车', value: 'trainList', code: 'TRAIN' }
],
deviceCodesList: []
};
},
computed: {
action() {
return `${process.env.VUE_APP_UPLOAD_API}${meansUrl}`;
},
form() {
const form = {
labelWidth: '120px',
items: [
{ prop: 'mapId', label: '选择线路:', type:'select', options: this.mapList, optionValue:'id', optionLabel:'name', change: true, onChange: this.handleMap },
{ prop: 'deviceTypes', label: '选择设备类型:', type:'select', options: this.deviceTypeList, optionValue:'value', optionLabel:'label', change: true, onChange: this.handleDevice },
{ prop: 'deviceIds', label: '选择设备:', type:'select', multiple: true, options: this.deviceCodesList, optionValue:'code', optionLabel:'name' },
{ prop: 'upload', label: '上传:', type:'uploadPicture', show: this.type == 'ADD', action: this.action, fileList: this.fileList, onChange: this.onChange, onSuccess: this.onSuccess }
]
};
return form;
},
rules() {
const crules = {
mapId: [
{ required: true, message: '请选择线路', trigger: 'change' }
],
deviceTypes: [
{ required: true, message: '请选择设备类型', trigger: 'change' }
],
deviceIds: [
{ required: true, message: '请选择设备', trigger: 'change' }
]
};
return crules;
},
title() {
if (this.type === 'ADD') {
return '上传PDF';
} else {
return '更新文章';
}
}
},
methods: {
async show(data) {
this.dialogVisible = true;
if (this.type != 'ADD') {
const obj = this.deviceTypeList.find(el => el.code == data.deviceTypes[0]);
this.id = data.id;
this.rowData = data;
this.rowData.deviceTypes = obj ? obj.value : '';
this.formModel = {
mapId: data.mapId,
deviceTypes: obj ? obj.value : '',
deviceIds: data.deviceIds,
upload: '',
filePath: data.filePath
};
await this.handleMap(data.mapId);
obj && await this.handleDevice(obj.value);
} else {
this.rowData = {};
this.formModel = {
mapId: '',
deviceTypes: '',
deviceIds: [],
upload: '',
filePath: ''
};
}
},
async handleMap(mapId) {
if (mapId) {
if (mapId != this.rowData.mapId) {
this.formModel.deviceIds = [];
this.formModel.deviceTypes = '';
}
return new Promise(async (resolve, reject) => {
const resp = await getPublishMapVersionById(mapId);
const version = resp.data;
dbReadData('mapData', mapId, version, async (mapData, version) =>{
if (mapData && mapData.version == version) {
this.graphDataNew = mapData.graphDataNew;
resolve();
} else if (mapData) {
const res = await getPublishMapDetailById(mapId);
this.graphDataNew = res.data.graphDataNew;
dbUpdateData('mapData', res.data);
resolve();
} else {
const res = await getPublishMapDetailById(mapId);
this.graphDataNew = res.data.graphDataNew;
dbAddData('mapData', res.data);
resolve();
}
});
});
} else {
this.formModel.deviceIds = [];
this.formModel.mapId = '';
this.formModel.deviceTypes = '';
}
},
handleDevice(type) {
if (type) {
if (type != this.rowData.deviceTypes) {
this.formModel.deviceIds = [];
}
this.deviceCodesList = this.graphDataNew[type].map(el => {
return {
code: el.code,
name: `${el.name}(${el.code})`
};
});
} else {
this.formModel.deviceIds = [];
}
},
// uploadFile(file) {
// this.formData.append('file', file.file);
// },
onSuccess(res, file) {
this.formModel.filePath = res.data;
},
doSave() {
const self = this;
this.$refs.dataform.validateForm(() => {
if (self.type == 'ADD') {
self.create();
} else {
self.update();
}
});
},
create() {
const self = this;
const obj = this.deviceTypeList.find(el => el.value == this.formModel.deviceTypes);
if (obj) {
this.formModel.deviceTypes = [obj.code];
}
const data = {
fileType: 'DRAWING',
mapId: this.formModel.mapId,
deviceTypes: this.formModel.deviceTypes,
deviceIds: this.formModel.deviceIds,
filePath: this.formModel.filePath
};
postUploadFile(data).then((res) => {
self.$message.success('上传PDF成功!');
self.handleClose();
self.$emit('reloadTable');
}).catch(error => {
console.log(error);
self.$message.error(`创建文章失败:${error.message}`);
});
},
update() {
const self = this;
const obj = this.deviceTypeList.find(el => el.value == this.formModel.deviceTypes);
if (obj) {
this.formModel.deviceTypes = [obj.code];
}
const data = {
id: this.id,
fileType: 'DRAWING',
mapId: this.formModel.mapId,
deviceTypes: this.formModel.deviceTypes,
deviceIds: this.formModel.deviceIds,
filePath: this.formModel.filePath
};
putUploadFile(data).then(() => {
self.$message.success('更新文章成功!');
self.handleClose();
self.$emit('reloadTable');
}).catch(error => {
self.$message.error(`更新文章失败:${error.message}`);
});
},
handleClose() {
this.formModel = {
title: ''
};
this.$refs.dataform.resetForm();
this.dialogVisible = false;
}
}
};
</script>
<style lang="scss" scoped>
.uploadDialog{
/deep/ {
.el-select--medium{
width: 300px;
}
}
}
</style>

View File

@ -0,0 +1,229 @@
<template>
<div>
<!-- <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" /> -->
<el-card>
<el-form
ref="queryForm"
:model="formModel"
size="small"
style="padding: 6px 20px 6px 20px;overflow: hidden;"
>
<el-form-item label="地图" style="margin-bottom: 0;float: left; width: 300px;">
<el-select v-model="formModel.mapId" placeholder="请选择" filterable style="width: 240px;" @change="handleMap">
<el-option
v-for="item in mapList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="设备类型" style="margin-bottom: 0;float: left; width:350px;">
<el-select v-model="formModel.deviceType" placeholder="请选择" filterable clearable style="width: 240px;" @change="handleDevice">
<el-option
v-for="item in deviceTypeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="设备id" style="margin-bottom: 0;float: left; width: 300px;">
<el-select v-model="formModel.deviceId" placeholder="请选择" filterable clearable style="width: 200px;">
<el-option
v-for="item in deviceIdList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-button style="margin-right: 10px; float: right;" type="primary" size="small" @click="createTitle">创建</el-button>
<el-button style="margin-right: 10px; float: right;" type="primary" size="small" @click="query">查询</el-button>
</el-form>
</el-card>
<el-table :data="tableData" border style="width: 100%">
<el-table-column label="线路">
<template slot-scope="scope">
<span>{{ getMapName(scope.row.mapId) }}</span>
</template>
</el-table-column>
<el-table-column label="类型">
<template slot-scope="scope">
<span>{{ scope.row.deviceTypes }}</span>
</template>
</el-table-column>
<el-table-column label="设备">
<template slot-scope="scope">
<el-tag v-for="(item, index) in scope.row.deviceIds" :key="index" class="deviceIdTag">{{ item }}</el-tag>
</template>
</el-table-column>
<el-table-column label="路径" prop="filePath" />
<el-table-column label="时间" prop="createTime" />
<el-table-column label="操作" width="450">
<template slot-scope="scope">
<!-- <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button> -->
<el-button size="mini" @click="handleUpdate(scope.$index, scope.row)">更新</el-button>
<!-- <el-button size="mini" @click="handlePublish(scope.$index, scope.row)">发布</el-button> -->
<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<Edit ref="edits" type="ADD" :map-list="mapList" @reloadTable="reloadTable" />
<Edit ref="edit" type="EDIT" :map-list="mapList" @reloadTable="reloadTable" />
</div>
</template>
<script>
import { getPublishMapDetailById, getPublishMapVersionById } from '@/api/jmap/map';
import { getUploadFile, deleteUploadFile } from '@/api/pdf';
import { getPublishMapList } from '@/api/jmap/map';
import { dbReadData, dbAddData, dbUpdateData } from '@/utils/indexedDb';
import Edit from './edit';
export default {
name: 'CacheControl',
components: {
Edit
},
data() {
return {
tableData: [],
formModel: {
mapId: '',
deviceType:'',
deviceId:''
},
mapList: [],
graphDataNew:null,
deviceIdList:[],
deviceTypeList: [
{ label: '区段', value: 'sectionList', code: 'SECTION' },
{ label: '道岔', value: 'switchList', code: 'SWITCH' },
{ label: '信号机', value: 'signalList', code: 'SIGNAL' },
{ label: '车站', value: 'stationList', code: 'STATION' },
{ label: '站台', value: 'stationStandList', code: 'STAND' },
{ label: '屏蔽门', value: 'psdList', code: 'PSD' },
{ label: '列车', value: 'trainList', code: 'TRAIN' }
]
};
},
created() {
const params = {
pageSize: 9999,
pageNum: 1
};
getPublishMapList(params).then(res => {
// this.mapList = res.data.list.filter(el => !el.project );
this.mapList = res.data.list || [];
if (this.mapList.length > 0) { this.formModel.mapId = this.mapList[0].id; this.handleMap(this.formModel.mapId); }
this.query();
});
},
methods: {
query() {
this.reloadTable();
},
getMapName(val) {
if (this && this.mapList.length) {
const data = this.mapList.find(el => el.id == val);
return data.name;
}
return val;
},
createTitle() {
this.$refs.edits.show();
},
// //
// handleEdit(row, data) {
// this.$router.push({path : '/editor', query: {docId: data.id, draft: 1}});
// },
//
handleUpdate(row, data) {
this.$refs.edit.show(data);
},
// // 稿
// handlePublish(row, data) {
// console.log(data);
// putDocDraftByIdPublish(data.id).then(res => {
// this.$message.success('!');
// this.reloadTable();
// }).catch(error => {
// this.$message.error(`: ${error.data}`);
// });
// },
handleDelete(row, data) {
this.$confirm('是否确认删除?', this.$t('tip.hint'), {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteUploadFile(data.id).then(res => {
this.$message.success('删除文章成功!');
this.reloadTable();
}).catch(error => {
this.$message.error(`删除失败: ${error.data}`);
});
}).catch(() => {});
},
reloadTable() {
this.tableData = [];
getUploadFile(this.formModel).then(res => {
this.tableData = res.data;
this.tableData.forEach(each=>{
const deviceTypeName = this.deviceTypeList.find(type=>{ return type.code == each.deviceTypes[0]; }) || {label:''};
each.deviceTypes = deviceTypeName.label;
});
}).catch(error => {
console.log(error);
});
},
handleMap(mapId) {
this.deviceIdList = [];
this.formModel.deviceId = '';
this.formModel.deviceType = '';
return new Promise(async (resolve, reject) => {
const resp = await getPublishMapVersionById(mapId);
const version = resp.data;
dbReadData('mapData', mapId, version, async (mapData, version) =>{
if (mapData && mapData.version == version) {
this.graphDataNew = mapData.graphDataNew;
resolve();
} else if (mapData) {
const res = await getPublishMapDetailById(mapId);
this.graphDataNew = res.data.graphDataNew;
dbUpdateData('mapData', res.data);
resolve();
} else {
const res = await getPublishMapDetailById(mapId);
this.graphDataNew = res.data.graphDataNew;
dbAddData('mapData', res.data);
resolve();
}
});
});
},
handleDevice(type) {
if (type) {
const data = this.graphDataNew[type];
if (data && data.length > 0) {
this.deviceIdList = this.graphDataNew[type].map(el => {
return {
code: el.code,
name: `${el.name}(${el.code})`
};
});
} else {
this.deviceIdList = [];
}
} else {
this.formModel.deviceId = '';
this.deviceIdList = [];
}
}
}
};
</script>
<style lang="scss" scoped>
.deviceIdTag{margin-right:5px;}
</style>

File diff suppressed because it is too large Load Diff

BIN
static/lesson3d/mst.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.0 KiB