joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

增加三维资源模型上传页面

Browse Source
This commit is contained in:
sunzhenyu 2020-07-02 15:33:35 +08:00
parent 9d855f5910
commit c34aa9d223
13 changed files with 680 additions and 253 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
src/api/jlmap3d/assets3d.js Normal file
View File

@ -0,0 +1,67 @@
import request from '@/utils/request';
import { getBaseUrl } from '@/utils/baseUrl';
const BASE_API = getBaseUrl();
let uploadurl = null;
if(BASE_API == "https://test.joylink.club/jlcloud"){
uploadurl = "https://test.joylink.club/jlfile";
}else if(BASE_API == "https://joylink.club/jlcloud"){
uploadurl = "https://joylink.club/jlfile";
}else{
uploadurl = "http://192.168.3.41:9300";
}
const BASE_UPLOAD_API = uploadurl;
export function getUploadModelUrl() {
return (BASE_UPLOAD_API+"/api/upload/MODEL?appId=00001&appSecret=joylink00001");
}
export function getUploadPicUrl() {
return (BASE_UPLOAD_API+"/api/upload/PICTURE?appId=00001&appSecret=joylink00001");
}
export function deleteAsset(url) {
return request({
url: BASE_UPLOAD_API+`/api/upload/delete?url=${url}&appId=00001&appSecret=joylink00001`,
method: 'delete',
});
}
//按id删除文件信息
export function deleteAssetData(id) {
return request({
url: `/api/map3dModel/${id}/delete`,
method: 'delete',
});
}
export function saveMap3dModelData(data) {
return request({
url: `/api/map3dModel`,
method: 'post',
data: data
});
}
export function getMap3dModelDataAll() {
return request({
url: `/api/map3dModel/all`,
method: 'get'
});
}
export function updateMap3dModelData(data) {
return request({
url: `/api/map3dModel`,
method: 'put',
data: data
});
}
export function getMap3dModelData(data) {
return request({
url: `/api/map3dModel?resourceType=`+data,
method: 'get'
});
}

22
src/jlmap3d/edit/jlmap3dedit.js
View File

@ -216,17 +216,17 @@ export function JLmap3dEdit(dom, data, mapid) {
// if(scope.editmode == "switchedit"){
// scope.selectmodel = scope.action.switchaction.raycaster(scope);
// }
if(scope.editmode == "pathedit"){
if(scope.actionmode == "drawrail"){
//console.log("drawrail");
scope.selectmodel = scope.action.pathaction.drawline(scope);
}
if(scope.actionmode == "drawcurve"){
scope.selectmodel = scope.action.pathaction.drawcurve(scope);
}
}
// if(scope.editmode == "pathedit"){
//
// if(scope.actionmode == "drawrail"){
// //console.log("drawrail");
// scope.selectmodel = scope.action.pathaction.drawline(scope);
// }
//
// if(scope.actionmode == "drawcurve"){
// scope.selectmodel = scope.action.pathaction.drawcurve(scope);
// }
// }
}

4
src/utils/baseUrl.js
View File

@ -2,11 +2,11 @@ export function getBaseUrl() {
let BASE_API;
if (process.env.NODE_ENV === 'development') {
// BASE_API = 'https://joylink.club/jlcloud';
// BASE_API = 'https://test.joylink.club/jlcloud';
BASE_API = 'https://test.joylink.club/jlcloud';
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
// BASE_API = 'http://192.168.3.41:9000'; // 张赛
BASE_API = 'http://192.168.3.82:9000'; // 杜康
// BASE_API = 'http://192.168.3.82:9000'; // 杜康
// BASE_API = 'http://b29z135112.zicp.vip';
// BASE_API = 'http://2925963m2a.zicp.vip'; // 杜康
// BASE_API = 'http://2i38984j47.qicp.vip'; // 张赛

93
src/views/jlmap3d/edit/component/action.vue
View File

@ -4,7 +4,7 @@
<el-tabs :tab-position="tabPosition" v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="路径绘制" name="pathedit" >
<!-- <el-tab-pane label="路径绘制" name="pathedit" >
<el-row>
<el-button id="drawrail" class="editbutton" @click="actionevent">直线</el-button>
</el-row>
@ -12,68 +12,85 @@
<el-row>
<el-button id="drawcurve" class="editbutton" @click="actionevent">曲线</el-button>
</el-row>
</el-tab-pane> -->
<el-tab-pane label="轨道编辑" name="trackedit" >
</el-tab-pane>
<el-tab-pane label="道岔编辑" name="switchedit">
<el-row>
<!-- <el-row>
<el-button id="switchreplace" class="editbutton" @click="actionevent">道岔模型设置</el-button>
</el-row>
</el-row> -->
</el-tab-pane>
<el-tab-pane label="轨道编辑" name="trackedit">
<el-row>
<el-button id="trackreplace" class="editbutton" @click="actionevent">铁轨模型配置</el-button>
</el-row>
<el-row>
<el-button id="tracktexture" class="editbutton" @click="actionevent">隧道贴图配置</el-button>
</el-row>
</el-tab-pane>
<el-tab-pane label="信号灯编辑" name="signaledit">
<el-row>
<!-- <el-row>
<el-button id="signalreplace" class="editbutton" @click="actionevent">信号灯模型设置</el-button>
</el-row>
<el-row>
<el-button id="signaltexture" class="editbutton" @click="actionevent">信号灯模型调整</el-button>
</el-row>
</el-row> -->
</el-tab-pane>
<el-tab-pane label="站台编辑" name="stationedit">
<el-row>
<!-- <el-row>
<el-button id="stationreplace" class="editbutton" @click="actionevent">站台场景设置</el-button>
</el-row>
<el-row>
<el-button id="stationtexture" class="editbutton" @click="actionevent">站台场景调整</el-button>
</el-row>
</el-row> -->
</el-tab-pane>
<el-tab-pane label="列车编辑" name="trainedit">
<el-row>
<el-button id="trainreplace" class="editbutton" @click="actionevent">列车模型设置</el-button>
</el-row>
<el-row>
<el-button id="traintexture" class="editbutton" @click="actionevent">列车模型调整</el-button>
</el-row>
<el-row>
<el-button id="" class="editbutton" @click="actionevent">列车驾驶室配置</el-button>
</el-row>
<el-tab-pane label="列车模型配置" name="trainedit">
<div >
<div>当前线路列车模型</div>
<div>
当前模型资源名称
</div>
<div style="width:128px;height:128px;background-image: url('/static/texture/add.png');background-size: 100% 100%;"></div>
</div>
</el-tab-pane>
<el-tab-pane label="布景编辑" name="sceneedit">
<el-row>
<el-button id="scenereplace" class="editbutton" @click="actionevent">布景模型添加</el-button>
</el-row>
<el-row>
<el-button id="scenetexture" class="editbutton" @click="actionevent">布景模型调整</el-button>
</el-row>
<el-tab-pane label="背景模型配置" name="sceneedit">
</el-tab-pane>
<el-tab-pane label="设备展示模型配置" name="deviceedit">
</el-tab-pane>
<el-tab-pane label="cctv模型配置" name="cctvedit">
</el-tab-pane>
<el-tab-pane label="通号模型配置" name="maintaineredit">
</el-tab-pane>
<el-tab-pane label="车站名称列表贴图" name="stationTextures">
</el-tab-pane>
<el-tab-pane label="单体设备展示贴图" name="deviceTextures">
</el-tab-pane>
<el-tab-pane label="信号机灯光贴图" name="signalLightTextures">
</el-tab-pane>
@ -92,7 +109,7 @@ export default {
},
data() {
return {
activeName: 'pathedit',
activeName: '',
tabPosition:'left',
size:'medium'
}
@ -110,21 +127,26 @@ export default {
},
handleClick(tab, event) {
//console.log(tab.name);
console.log(tab);
if(tab.name == "pathedit"){
this.$emit('saction',this.activeName);
}
if(tab.name == "switchedit"){
this.$emit('saction',this.activeName);
this.$emit('actionevent',"switchreplace");
}
if(tab.name == "trackedit"){
this.$emit('saction',this.activeName);
this.$emit('actionevent',"trackreplace");
}
if(tab.name == "signaledit"){
this.$emit('saction',this.activeName);
}
if(tab.name == "stationedit"){
this.$emit('saction',this.activeName);
this.$emit('actionevent',"stationreplace");
}
if(tab.name == "trainedit"){
this.$emit('saction',this.activeName);
@ -134,6 +156,7 @@ export default {
}
},
actionevent(event){
console.log(event.currentTarget.id);
this.$emit('actionevent',event.currentTarget.id);
//console.log();

39
src/views/jlmap3d/edit/component/assets.vue
View File

@ -6,9 +6,9 @@
<el-tab-pane label="模型" name="models">
<el-scrollbar style="margin-bottom:1px">
<el-form ref="form" label-width="130px" size="mini">
<div class="modellist" v-for="(asset,index) in modellist" @click="modelselect(index)" v-show="asset.deviceType==modelcalsstype" >
<div class="modellist" v-for="(asset,index) in modellist" @click="modelselect(index)">
<div >
<img class="modelpic" :src="asset.picUrl">
<img class="modelpic" draggable="true" >
<p class="modelp">{{asset.name }}</p>
</div>
</div>
@ -58,7 +58,20 @@ export default {
children: 'children',
label: 'label'
},
modellist:[],
modellist:[
{
name:1,
},
{
name:1,
},
{
name:1,
},
{
name:1,
},
],
texturelist:[],
modelcalsstype:"signal"
}
@ -142,15 +155,15 @@ export default {
// ////console.log(this.modellist);
// });
loadmap3dModel().then(data => {
if(data.code == "200"){
//console.log(data);
this.modellist = data.data;
//console.log(this.modellist);
}
}).catch(error => {
//console.log(error);
});
// loadmap3dModel().then(data => {
// if(data.code == "200"){
// //console.log(data);
// this.modellist = data.data;
// //console.log(this.modellist);
// }
// }).catch(error => {
// //console.log(error);
// });
}
@ -195,6 +208,8 @@ export default {
position: absolute;
width:100%;
height:100%;
background-image: url('/static/texture/modelfile.png');
background-size: 100% 100%;
}
.modelp{
position: absolute;

21
src/views/jlmap3d/jl3dassetmanager/assetmanager.vue
View File

@ -3,13 +3,13 @@
<div class="jl3dmanager">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="模型列表" name="modellist">
<Model-List>
<Model-List ref="modelList" @replaceAsset="replaceAsset">
</Model-List>
</el-tab-pane>
<el-tab-pane label="贴图列表" name="piclist">
<Pic-List>
<Pic-List ref="picList" @replaceAsset="replaceAsset">
</Pic-List>
</el-tab-pane>
<el-tab-pane label="上传模型" name="uploadmodel">
@ -24,7 +24,7 @@
</el-tab-pane>
<el-tab-pane label="替换模型" name="replacemodel">
<Replace-Model>
<Replace-Model ref="replaceModel">
</Replace-Model>
</el-tab-pane>
</el-tabs>
@ -50,12 +50,21 @@ export default {
},
data() {
return {
activeName: 'first'
activeName: ''
};
},
beforeDestroy() {
},
watch: {
'activeName': function (val) {
if(val == 'modellist'){
this.$refs.modelList.updatemodellist();
}else if(val == 'piclist'){
this.$refs.picList.updatetexturelist();
}
}
},
mounted() {
@ -63,6 +72,10 @@ export default {
methods: {
handleClick(tab, event) {
console.log(tab, event);
},
replaceAsset(replaceData){
this.activeName = 'replacemodel';
this.$refs.replaceModel.updateview(replaceData);
}
}
};

121
src/views/jlmap3d/jl3dassetmanager/component/modellist.vue
View File

@ -9,45 +9,49 @@
<el-table-column
prop="id"
label="资源id"
width="180">
>
</el-table-column>
<el-table-column
prop="modelname"
prop="packageName"
label="资源名称"
>
</el-table-column>
<el-table-column
prop="name"
label="模型名称"
width="180">
>
</el-table-column>
<el-table-column
prop="upuser"
prop="uploaderId"
label="上传用户"
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="modeltype"
prop="resourceType"
label="模型类型"
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="devicetype"
prop="deviceType"
label="设备类型"
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="modelmsg"
prop="remarks"
label="模型信息"
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="newuploaddate"
label="最新修改时间"
sortable
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="uploaddate"
prop="uploadTime"
label="上传时间"
sortable
:formatter="formatter">
>
</el-table-column>
<el-table-column
align="right">
@ -63,7 +67,7 @@
@click="handleEdit(scope.$index, scope.row)">预览</el-button>
<el-button
size="mini"
@click="handleEdit(scope.$index, scope.row)">替换</el-button>
@click="replaceAsset(scope.$index, scope.row)">替换</el-button>
<el-button
size="mini"
@click="handleEdit(scope.$index, scope.row)">下载</el-button>
@ -79,6 +83,7 @@
</template>
<script>
import { getMap3dModelDataAll,getMap3dModelData,deleteAsset,deleteAssetData } from '@/api/jlmap3d/assets3d.js'
export default {
name: 'ModelList',
@ -88,36 +93,7 @@ export default {
data() {
return {
tableData: [
{
id: '1',
modelname: '1',
upuser: '1',
modeltype:"1",
devicetype:"1",
modelmsg:"1",
newuploaddate:'2016-05-02',
uploaddate:'2016-05-02'
},
{
id: '1',
modelname: '1',
upuser: '1',
modeltype:"1",
devicetype:"1",
modelmsg:"1",
newuploaddate:'2016-05-02',
uploaddate:'2016-05-02'
},
{
id: '1',
modelname: '1',
upuser: '1',
modeltype:"1",
devicetype:"1",
modelmsg:"1",
newuploaddate:'2016-05-02',
uploaddate:'2016-05-02'
}
],
search: ''
};
@ -129,14 +105,65 @@ export default {
},
methods: {
updatemodellist(){
this.tableData = [];
// getMap3dModelData("SandboxScene").then(netdata => {
// console.log(netdata);
// }).catch(error => {
// console.log(error);
// });
getMap3dModelDataAll().then(netdata => {
for(let i=0,leni=netdata.data.length;i<leni;i++){
console.log(netdata.data[i]);
if(netdata.data[i].fileType == "model"){
let newdata = {
id: netdata.data[i].id,
packageName: netdata.data[i].packageName,
name: netdata.data[i].name,
uploaderId: netdata.data[i].uploaderId,
resourceType:netdata.data[i].resourceType,
deviceType:netdata.data[i].deviceType,
remarks:netdata.data[i].remarks,
modelurl:netdata.data[i].url,
newuploaddate:'2016-05-02',
uploadTime:netdata.data[i].uploadTime,
};
this.tableData.push(newdata);
}
}
console.log(this.tableData);
}).catch(error => {
console.log(error);
});
},
formatter(row, column) {
return row.address;
},
handleEdit(index, row) {
console.log(index, row);
},
replaceAsset(index, row) {
console.log(row);
this.$emit('replaceAsset', row);
},
handleDelete(index, row) {
console.log(index, row);
console.log(row);
deleteAsset(row.modelurl).then(netdata => {
console.log(netdata);
deleteAssetData(row.id).then(netdata => {
this.tableData.splice(index, 1);
console.log(netdata);
}).catch(error => {
console.log(error);
});
}).catch(error => {
console.log(error);
});
}
}
};

82
src/views/jlmap3d/jl3dassetmanager/component/piclist.vue
View File

@ -8,42 +8,50 @@
>
<el-table-column
prop="id"
label="资源id"
width="180">
label="图片id"
>
</el-table-column>
<el-table-column
prop="modelname"
prop="packageName"
label="图片名称"
width="180">
>
</el-table-column>
<el-table-column
prop="upuser"
prop="name"
label="图片名称"
>
</el-table-column>
<el-table-column
prop="uploaderId"
label="上传用户"
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="type"
label="类型"
:formatter="formatter">
prop="resourceType"
label="图片类型"
>
</el-table-column>
<el-table-column
prop="belone"
label="所属项目"
:formatter="formatter">
prop="deviceType"
label="图片所属项目"
>
</el-table-column>
<el-table-column
prop="remarks"
label="图片信息"
>
</el-table-column>
<el-table-column
prop="newuploaddate"
label="最新修改时间"
sortable
:formatter="formatter">
>
</el-table-column>
<el-table-column
prop="uploaddate"
prop="uploadTime"
label="上传时间"
sortable
:formatter="formatter">
>
</el-table-column>
<el-table-column
align="right">
@ -73,6 +81,7 @@
</template>
<script>
import { getMap3dModelDataAll,getMap3dModelData,deleteAsset,deleteAssetData } from '@/api/jlmap3d/assets3d.js'
export default {
name: 'PicList',
@ -82,16 +91,7 @@ export default {
data() {
return {
tableData: [
{
id: '1',
modelname: '1',
upuser: '1',
type:"1",
isanimate:false,
isuse:false,
newuploaddate:'2016-05-02',
uploaddate:'2016-05-02'
}
],
search: ''
};
@ -103,6 +103,34 @@ export default {
},
methods: {
updatetexturelist(){
this.tableData = [];
getMap3dModelDataAll().then(netdata => {
for(let i=0,leni=netdata.data.length;i<leni;i++){
console.log(netdata.data[i]);
if(netdata.data[i].fileType == "texture"){
let newdata = {
id: netdata.data[i].id,
packageName: netdata.data[i].packageName,
name: netdata.data[i].name,
uploaderId: netdata.data[i].uploaderId,
resourceType:netdata.data[i].resourceType,
deviceType:netdata.data[i].deviceType,
remarks:netdata.data[i].remarks,
modelurl:netdata.data[i].url,
newuploaddate:'2016-05-02',
uploadTime:netdata.data[i].uploadTime,
};
this.tableData.push(newdata);
}
}
console.log(this.tableData);
}).catch(error => {
console.log(error);
});
},
formatter(row, column) {
return row.address;
},

165
src/views/jlmap3d/jl3dassetmanager/component/replacemodel.vue
View File

@ -1,19 +1,80 @@
<template>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="资源名称">
<el-input v-model="form.packageName "></el-input>
</el-form-item>
<el-form-item label="资源类型">
<el-select v-model="form.resourceType" placeholder="请选择模型类型">
<el-option label="沙盘场景" value="SandboxScene"></el-option>
<el-option label="驾驶场景" value="DriveScene"></el-option>
<el-option label="单体设备展示场景" value="DeviceScene"></el-option>
<el-option label="通号维修场景" value="MaintainerScene"></el-option>
<el-option label="cctv场景" value="CctvScene"></el-option>
<el-option label="站台列表名称贴图" value="textureStation"></el-option>
<el-option label="信号机贴图" value="textureSignal"></el-option>
<el-option label="单体设备贴图" value="textureDevice"></el-option>
</el-select>
</el-form-item>
<el-form-item label="资源设备类型">
<el-select v-model="form.deviceType" placeholder="请选择设备用途类型">
<el-option label="沙盘驾驶列车" value="SimulationTrain"></el-option>
<el-option label="沙盘驾驶车站" value="SimulationStation"></el-option>
<el-option label="沙盘驾驶信号机" value="SimulationSignal"></el-option>
<el-option label="沙盘驾驶道岔" value="SimulationSwitch"></el-option>
<el-option label="沙盘驾驶背景模型" value="SimulationBg"></el-option>
<el-option label="单体设备道岔" value="DeviceSwitch"></el-option>
<el-option label="单体设备屏蔽门" value="DeviceDoor"></el-option>
<el-option label="单体设备区段" value="DeviceSection"></el-option>
<el-option label="单体设备信号机" value="DeviceSignal"></el-option>
<el-option label="单体设备列车" value="DeviceTrain"></el-option>
<el-option label="cctv车站" value="CctvStation"></el-option>
<el-option label="cctv监视器" value="CctvCamera"></el-option>
<el-option label="cctv闸机" value="CctvGate"></el-option>
<el-option label="cctv人物" value="CctvHuman"></el-option>
<el-option label="通号机房" value="MaintainerRoom"></el-option>
</el-select>
</el-form-item>
<el-form-item label="资源所属项目">
<el-input v-model="form.line"></el-input>
</el-form-item>
<el-form-item label="图片信息">
<el-input type="textarea" v-model="form.remarks"></el-input>
</el-form-item>
<el-upload
class="upload-demo"
ref="upload"
drag
action="https://jsonplaceholder.typicode.com/posts/"
multiple>
:action="updateurl"
:headers="importHeaders"
multiple
:auto-upload="false"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:on-success="handleSuccess"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
<div class="el-upload__tip" slot="tip">只能上传fbx文件</div>
</el-upload>
<el-form-item>
<el-button type="primary" @click="onSubmit">更新数据</el-button>
<el-button>取消</el-button>
</el-form-item>
</el-form>
</el-form>
</template>
<script>
import { getUploadModelUrl,getUploadPicUrl,updateMap3dModelData } from '@/api/jlmap3d/assets3d.js'
import { getToken } from '@/utils/auth';
export default {
name: 'ReplaceModel',
components: {
@ -21,7 +82,20 @@ export default {
},
data() {
return {
importHeaders:{'X-Token': getToken()},
form: {
id:'',
packageName : '',
resourceType : '',
deviceType : '',
fileType :'',
line : '',
remarks : '',
name:'',
url:'',
},
successnum:0,
updateurl:"http://192.168.3.41:9300/api/upload/update",
};
},
beforeDestroy() {
@ -31,7 +105,88 @@ export default {
},
methods: {
onSubmit() {
// console.log(this.form);
if(this.updateurl){
console.log(this.updateurl);
this.$refs.upload.submit();
}
},
updateview(replacemodel){
this.form.id = replacemodel.id;
this.form.packageName = replacemodel.packageName;
this.form.resourceType = replacemodel.resourceType;
this.form.fileType = replacemodel.fileType;
if(replacemodel.deviceType){
this.form.deviceType = replacemodel.deviceType;
}else{
this.form.deviceType = '';
}
if(replacemodel.line){
this.form.line = replacemodel.line;
}else{
this.form.line = '';
}
if(replacemodel.remarks){
this.form.remarks = replacemodel.remarks;
}else{
this.form.remarks = '';
}
this.form.name = replacemodel.name;
this.form.url = replacemodel.modelurl;
// let resdata = replacemodel.modelurl.replace(/\\/g,"\\\\");
if(replacemodel.fileType == "model"){
this.updateurl = getUploadModelUrl();
}else if(replacemodel.fileType == "texture"){
this.updateurl = getUploadPicUrl();
}
},
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
handleSuccess(response, file, fileList){
this.successnum += 1;
console.log(response);
console.log(fileList);
console.log(this.successnum);
if(fileList.length == this.successnum){
let data = {
id:this.form.id,
packageName : this.form.packageName,
resourceType : this.form.resourceType,
deviceType : this.form.deviceType,
fileType : this.form.fileType,
line : this.form.line,
remarks : this.form.remarks,
name : this.form.name,
url : this.form.url,
};
// for(let i=0,leni=fileList.length;i<leni;i++){
// let resdata = fileList[i].response.replace(/\\/g,"/");
// data.nameAndUrl[fileList[i].name.split(".")[0]] = JSON.parse(resdata).data;
// }
//
if(data){
updateMap3dModelData(data).then(netdata => {
console.log(netdata);
}).catch(error => {
console.log(error);
});
}
// this.successnum = 0;
}
}
}
};
</script>

109
src/views/jlmap3d/jl3dassetmanager/component/uploadmodel.vue
View File

@ -3,44 +3,60 @@
<div>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="模型名称">
<el-input v-model="form.name"></el-input>
<el-input v-model="form.packageName "></el-input>
</el-form-item>
<el-form-item label="模型类型">
<el-select v-model="form.region" placeholder="请选择模型类型">
<el-option label="单体设备" value="device"></el-option>
<el-option label="沙盘驾驶" value="sandbox"></el-option>
<el-option label="通号" value="maintainer"></el-option>
<el-option label="cctv" value="cctv"></el-option>
<el-select v-model="form.resourceType" placeholder="请选择模型类型">
<el-option label="沙盘场景" value="SandboxScene"></el-option>
<el-option label="驾驶场景" value="DriveScene"></el-option>
<el-option label="单体设备展示场景" value="DeviceScene"></el-option>
<el-option label="通号维修场景" value="MaintainerScene"></el-option>
<el-option label="cctv场景" value="CctvScene"></el-option>
</el-select>
</el-form-item>
<el-form-item label="设备类型">
<el-select v-model="form.region" placeholder="请选择设备用途类型">
<el-option label="单体设备" value="device"></el-option>
<el-option label="沙盘驾驶" value="sandbox"></el-option>
<el-option label="通号" value="maintainer"></el-option>
<el-option label="cctv" value="cctv"></el-option>
<el-select v-model="form.deviceType" placeholder="请选择设备用途类型">
<el-option label="沙盘驾驶列车" value="SimulationTrain"></el-option>
<el-option label="沙盘驾驶车站" value="SimulationStation"></el-option>
<el-option label="沙盘驾驶信号机" value="SimulationSignal"></el-option>
<el-option label="沙盘驾驶道岔" value="SimulationSwitch"></el-option>
<el-option label="沙盘驾驶背景模型" value="SimulationBg"></el-option>
<el-option label="单体设备道岔" value="DeviceSwitch"></el-option>
<el-option label="单体设备屏蔽门" value="DeviceDoor"></el-option>
<el-option label="单体设备区段" value="DeviceSection"></el-option>
<el-option label="单体设备信号机" value="DeviceSignal"></el-option>
<el-option label="单体设备列车" value="DeviceTrain"></el-option>
<el-option label="cctv车站" value="CctvStation"></el-option>
<el-option label="cctv监视器" value="CctvCamera"></el-option>
<el-option label="cctv闸机" value="CctvGate"></el-option>
<el-option label="cctv人物" value="CctvHuman"></el-option>
<el-option label="通号机房" value="MaintainerRoom"></el-option>
</el-select>
</el-form-item>
<el-form-item label="模型信息">
<el-input type="textarea" v-model="form.desc"></el-input>
<el-input type="textarea" v-model="form.remarks "></el-input>
</el-form-item>
<el-form-item>
<el-upload
class="upload-demo"
ref="upload"
drag
action="https://jsonplaceholder.typicode.com/posts/"
:action="uploadModelUrl"
:headers="importHeaders"
multiple
:auto-upload="false"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
data = "from"
:on-success="handleSuccess"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
<div class="el-upload__tip" slot="tip">只能上传fbx文件</div>
</el-upload>
</el-form-item>
@ -54,6 +70,10 @@
</template>
<script>
//
import { getUploadModelUrl,saveMap3dModelData } from '@/api/jlmap3d/assets3d.js'
import { getToken } from '@/utils/auth';
export default {
name: 'UploadModel',
@ -62,27 +82,31 @@
},
data() {
return {
uploadModelUrl:getUploadModelUrl(),
importHeaders:{'X-Token': getToken()},
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}
packageName : '',
resourceType : '',
deviceType : '',
remarks : '',
},
successnum:0,
};
},
beforeDestroy() {
},
computed: {
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
},
mounted() {
this.nowtoken = getToken();
},
methods: {
onSubmit() {
console.log(this.form);
// console.log(this.form);
this.$refs.upload.submit();
},
submitUpload() {
@ -94,6 +118,39 @@
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
handleSuccess(response, file, fileList){
this.successnum += 1;
console.log(response);
console.log(fileList);
console.log(this.successnum);
if(fileList.length == this.successnum){
let data = {
packageName:this.form.packageName ,
resourceType:this.form.resourceType,
deviceType:this.form.deviceType,
fileType:'model',
line:'',
remarks:this.form.remarks,
nameAndUrl:{},
};
for(let i=0,leni=fileList.length;i<leni;i++){
// let resdata = fileList[i].response.replace(/\\/g,"\\\\");
// console.log(resdata);
data.nameAndUrl[fileList[i].name] = fileList[i].response.data;
}
console.log(data);
if(data){
saveMap3dModelData(data).then(netdata => {
console.log(netdata);
}).catch(error => {
console.log(error);
});
}
this.successnum = 0;
}
}
}
};

84
src/views/jlmap3d/jl3dassetmanager/component/uploadpic.vue
View File

@ -1,41 +1,42 @@
<template>
<div>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="图片名称">
<el-input v-model="form.name"></el-input>
<el-form-item label="图片包名称">
<el-input v-model="form.packageName"></el-input>
</el-form-item>
<el-form-item label="图片类型">
<el-select v-model="form.region" placeholder="请选择图片用途">
<el-option label="单体设备" value="device"></el-option>
<el-option label="沙盘驾驶" value="sandbox"></el-option>
<el-option label="通号" value="maintainer"></el-option>
<el-option label="cctv" value="cctv"></el-option>
<el-select v-model="form.resourceType" placeholder="请选择图片用途">
<el-option label="站台列表名称贴图" value="textureStation"></el-option>
<el-option label="信号机贴图" value="textureSignal"></el-option>
<el-option label="单体设备贴图" value="textureDevice"></el-option>
</el-select>
</el-form-item>
<el-form-item label="所属项目">
<el-input v-model="form.name"></el-input>
<el-input v-model="form.line"></el-input>
</el-form-item>
<el-form-item label="图片信息">
<el-input type="textarea" v-model="form.desc"></el-input>
<el-input type="textarea" v-model="form.remarks"></el-input>
</el-form-item>
<el-form-item>
<el-upload
class="upload-demo"
ref="upload"
drag
action="https://jsonplaceholder.typicode.com/posts/"
:action="uploadPicUrl"
multiple
:auto-upload="false"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
data = "from"
:on-success="handleSuccess"
:on-error="handleError"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
<div class="el-upload__tip" slot="tip">只能上传fbx文件</div>
</el-upload>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">立即创建</el-button>
@ -48,6 +49,8 @@
<script>
import { getUploadPicUrl,saveMap3dModelData } from '@/api/jlmap3d/assets3d.js'
export default {
name: 'UploadPic',
components: {
@ -56,19 +59,22 @@ export default {
data() {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}
packageName : '',
fileType : '',
line : '',
remarks : '',
},
uploadPicUrl:getUploadPicUrl(),
successnum:0,
};
},
beforeDestroy() {
},
computed: {
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
},
mounted() {
@ -87,7 +93,43 @@ export default {
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
handleSuccess(response, file, fileList){
this.successnum += 1;
console.log(response);
console.log(fileList);
console.log(this.successnum);
if(fileList.length == this.successnum){
let data = {
packageName:this.form.packageName ,
resourceType:this.form.resourceType,
deviceType:'',
fileType:'texture',
remarks:this.form.remarks,
line:this.form.line,
nameAndUrl:{},
};
for(let i=0,leni=fileList.length;i<leni;i++){
data.nameAndUrl[fileList[i].name] = fileList[i].response.data;
}
console.log(data);
if(data){
saveMap3dModelData(data).then(netdata => {
console.log(netdata);
}).catch(error => {
console.log(error);
});
}
this.successnum = 0;
}
},
handleError(err, file, fileList){
console.log(err);
console.log(file);
console.log(fileList);
},
}
};
</script>

BIN
static/texture/add.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
static/texture/modelfile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB