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:
ival 2019-08-20 18:35:42 +08:00
parent 0afda8953a
commit de0fd028ed
15 changed files with 321 additions and 256 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/i18n/langs/en/permission.js
View File

@ -2,5 +2,18 @@ export default {
permissionPack: 'Package',
setSuccess: 'Set successfully',
isSureSetBelonger: 'Are you sure to set {name} to be the owner of the permission?',
belonger: 'Set Owner'
setBelonger: 'Set Owner',
lessonName: 'Lesson Name',
mapName: 'Map Name',
mapProductName: 'Product Name',
permissionType: 'Permission Type',
permissionStatus: 'Permission Status',
permissionUseType: 'Public/Private',
permissionTotal: 'Total',
permissionRemains: 'Remains',
isForever: 'Permanent',
startTime: 'Start Time',
endTime: 'End Time',
belonger: 'Owner',
userList: 'User List'
};

2
src/i18n/langs/en/replay.js
View File

@ -1,5 +1,5 @@
export default {
replay: 'playback',
replay: 'Play',
mapName: 'Map Name',
creatorId: 'Creator of ID',
createTime: 'Create Time',

15
src/i18n/langs/zh/permission.js
View File

@ -2,5 +2,18 @@ export default {
permissionPack: '权限打包',
setSuccess: '设置成功',
isSureSetBelonger: '是否确定设置{name}为权限所属人?',
belonger: '设置归属人'
setBelonger: '设置归属人',
lessonName: '课程名称',
mapName: '地图名称',
mapProductName: '产品名称',
permissionType: '权限类型',
permissionStatus: '权限状态',
permissionUseType: '公用/专用',
permissionTotal: '权限总数',
permissionRemains: '生于权限',
isForever: '是否永久',
startTime: '开始时间',
endTime: '结束时间',
belonger: '归属人',
userList: '用户列表'
};

12
src/store/modules/socket.js
View File

@ -88,6 +88,8 @@ function handle(state, data) {
case 'Simulation_Quest_Finish': // 任务结束标志
state.tipOperateCount++;
break;
case 'Simulation_Control_Pause': // 暂停中
state.simulationPause = msg;
}
}
@ -273,7 +275,8 @@ const socket = {
permissionOver: {}, // 权限结束
tipOperateCount: 0 // 任务结束提示消息
tipOperateCount: 0, // 任务结束提示消息
simulationPause: false // 是否暂停状态
},
getters: {
@ -326,6 +329,9 @@ const socket = {
setRoomInvite: (state, roomInvite) => {
state.roomInvite = roomInvite;
},
setSimulationPause: (state, pause) => {
state.simulationPause = pause;
}
},
@ -387,6 +393,10 @@ const socket = {
pushMsgQueue: ({ commit }, msg) => {
commit('pushMsgQueue', msg);
},
setSimulationPause: ({commit}, pause) => {
commit('setSimulationPause', pause);
}
}
};

4
src/utils/baseUrl.js
View File

@ -3,9 +3,9 @@ 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.6:9000'; // 旭强
// BASE_API = 'http://192.168.3.4:9000' // 琰培
} else {
BASE_API = process.env.VUE_APP_BASE_API;

165
src/views/components/systemTime/digit.vue
View File

@ -1,86 +1,93 @@
<template>
<div class="digit" :style="{width: 11*zoom+'px', height: 20*zoom+'px', top: top+'px'}">
<div class="segment on"
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowOne), top: zoom+'px', left: zoom*2+'px', right: zoom*2+'px', height: zblod+'px'}">
</div>
<div class="segment on"
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowTwo), top: zoom*2+'px', right: zoom+'px', width: zblod+'px', height: zoom*7.5+'px'}">
</div>
<div class="segment on"
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowThee), bottom: zoom*2+'px', right: zoom+'px', width: zblod+'px', height: zoom*7.5+'px'}">
</div>
<div class="segment on "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowFour), bottom: zoom+'px', right: zoom*2+'px', height: zblod+'px', left: zoom*2+'px' }">
</div>
<div class="segment on "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowFive), bottom: zoom*2+'px', left: zoom+'px', width: zblod+'px', height: zoom*7.5+'px'}">
</div>
<div class="segment on "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowSix), top: zoom*2+'px', left: zoom+'px',width: zblod+'px', height: zoom*7.5+'px'}">
</div>
<div class="segment "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowSeven), left: zoom*2+'px', right: zoom*2+'px', height: zblod+'px', bottom: zoom*9.5+'px'}">
</div>
</div>
<div class="digit" :style="{width: 11*zoom+'px', height: 20*zoom+'px', top: top+'px'}">
<div
class="segment on"
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowOne), top: zoom+'px', left: zoom*2+'px', right: zoom*2+'px', height: zblod+'px'}"
/>
<div
class="segment on"
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowTwo), top: zoom*2+'px', right: zoom+'px', width: zblod+'px', height: zoom*7.5+'px'}"
/>
<div
class="segment on"
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowThee), bottom: zoom*2+'px', right: zoom+'px', width: zblod+'px', height: zoom*7.5+'px'}"
/>
<div
class="segment on "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowFour), bottom: zoom+'px', right: zoom*2+'px', height: zblod+'px', left: zoom*2+'px' }"
/>
<div
class="segment on "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowFive), bottom: zoom*2+'px', left: zoom+'px', width: zblod+'px', height: zoom*7.5+'px'}"
/>
<div
class="segment on "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowSix), top: zoom*2+'px', left: zoom+'px',width: zblod+'px', height: zoom*7.5+'px'}"
/>
<div
class="segment "
:style="{ background: color, 'border-radius': zoom+'px', opacity: opacity(isShowSeven), left: zoom*2+'px', right: zoom*2+'px', height: zblod+'px', bottom: zoom*9.5+'px'}"
/>
</div>
</template>
<script>
export default {
name: 'digit',
props: {
top: {
type: Number,
required: true
},
zoom: {
type: Number,
required: true
},
number: {
type: Number,
required: true
},
fine: {
type: Number,
required: true,
},
color: {
type: String,
required: true,
}
},
computed: {
zblod() {
return parseInt(this.fine * this.zoom)
},
isShowOne() {
return [2, 3, 5, 6, 7, 8, 9, 0].indexOf(this.number) != -1;
},
isShowTwo() {
return [1, 2, 3, 4, 7, 8, 9, 0].indexOf(this.number) != -1;
},
isShowThee() {
return [1, 3, 4, 5, 6, 7, 8, 9, 0].indexOf(this.number) != -1;
},
isShowFour() {
return [2, 3, 5, 6, 8, 9, 0].indexOf(this.number) != -1;
},
isShowFive() {
return [2, 6, 8, 0].indexOf(this.number) != -1;
},
isShowSix() {
return [4, 5, 6, 8, 9, 0].indexOf(this.number) != -1;
},
isShowSeven() {
return [2, 3, 4, 5, 6, 8, 9].indexOf(this.number) != -1;
},
},
methods: {
opacity(show) {
return show ? 1 : 0.2;
}
}
}
export default {
name: 'Digit',
props: {
top: {
type: Number,
required: true
},
zoom: {
type: Number,
required: true
},
number: {
type: Number,
required: true
},
fine: {
type: Number,
required: true
},
color: {
type: String,
required: true
}
},
computed: {
zblod() {
return parseInt(this.fine * this.zoom);
},
isShowOne() {
return [2, 3, 5, 6, 7, 8, 9, 0].indexOf(this.number) != -1;
},
isShowTwo() {
return [1, 2, 3, 4, 7, 8, 9, 0].indexOf(this.number) != -1;
},
isShowThee() {
return [1, 3, 4, 5, 6, 7, 8, 9, 0].indexOf(this.number) != -1;
},
isShowFour() {
return [2, 3, 5, 6, 8, 9, 0].indexOf(this.number) != -1;
},
isShowFive() {
return [2, 6, 8, 0].indexOf(this.number) != -1;
},
isShowSix() {
return [4, 5, 6, 8, 9, 0].indexOf(this.number) != -1;
},
isShowSeven() {
return [2, 3, 4, 5, 6, 8, 9].indexOf(this.number) != -1;
}
},
methods: {
opacity(show) {
return show ? 1 : 0.2;
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

143
src/views/components/systemTime/index.vue
View File

@ -1,75 +1,84 @@
<template>
<div class="system-time-box"
:style="{background: background, width: width+'px', height: height+'px', 'line-height': height+'px'}">
<template v-for="(item,index) in time">
<digit v-if="Number.isInteger(parseInt(item))" :number="parseInt(item)" :color="color" :fine="fine"
:zoom="time.length - index > 2? zoom: zoom* 0.6" :top="top"></digit>
<separator v-if="!Number.isInteger(parseInt(item))" :color="color" :zoom="zoom" :fine="fine"></separator>
</template>
</div>
<div
class="system-time-box"
:style="{background: background, width: width+'px', height: height+'px', 'line-height': height+'px'}"
>
<template v-for="(item,index) in time">
<digit
v-if="Number.isInteger(parseInt(item))"
:key="index"
:number="parseInt(item)"
:color="color"
:fine="fine"
:zoom="time.length - index > 2? zoom: zoom* 0.6"
:top="top"
/>
<separator v-if="!Number.isInteger(parseInt(item))" :key="index" :color="color" :zoom="zoom" :fine="fine" />
</template>
</div>
</template>
<script>
import Digit from './digit';
import Separator from './separator';
import Digit from './digit';
import Separator from './separator';
export default {
name: 'SystenTime',
props: {
background: {
type: String,
default() {
return '#000';
}
},
color: {
type: String,
default() {
return '#00FF00'
}
},
time: {
type: String,
default() {
return '12:3456'
}
},
zoom: {
type: Number,
default() {
return 4;
}
},
width: {
type: Number,
default() {
return 280;
}
},
height: {
type: Number,
default() {
return 80;
}
},
fine: {
type: Number,
default() {
return 1;
}
},
top: {
type: Number,
default() {
return 1;
}
}
},
components: {
Digit,
Separator
}
}
export default {
name: 'SystenTime',
components: {
Digit,
Separator
},
props: {
background: {
type: String,
default() {
return '#000';
}
},
color: {
type: String,
default() {
return '#00FF00';
}
},
time: {
type: String,
default() {
return '12:3456';
}
},
zoom: {
type: Number,
default() {
return 4;
}
},
width: {
type: Number,
default() {
return 280;
}
},
height: {
type: Number,
default() {
return 80;
}
},
fine: {
type: Number,
default() {
return 1;
}
},
top: {
type: Number,
default() {
return 1;
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

63
src/views/components/systemTime/point.vue
View File

@ -1,38 +1,39 @@
<template>
<div class="point"
:style="{background: color, width: zblod+'px', height: zblod+'px', top: top+'px', 'border-radius': 0.5*zblod+'px'}">
</div>
<div
class="point"
:style="{background: color, width: zblod+'px', height: zblod+'px', top: top+'px', 'border-radius': 0.5*zblod+'px'}"
/>
</template>
<script>
export default {
name: 'point',
props: {
top: {
type: Number,
required: true,
},
zoom: {
type: Number,
required: true,
},
fine: {
type: Number,
required: true,
},
color: {
type: String,
required: true,
}
},
computed: {
zblod() {
return parseInt(this.fine * this.zoom)
}
},
methods: {
}
}
export default {
name: 'Point',
props: {
top: {
type: Number,
required: true
},
zoom: {
type: Number,
required: true
},
fine: {
type: Number,
required: true
},
color: {
type: String,
required: true
}
},
computed: {
zblod() {
return parseInt(this.fine * this.zoom);
}
},
methods: {
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

21
src/views/display/index.vue
View File

@ -26,10 +26,10 @@
<menu-replay v-if="isReplay" ref="menuReplay" :offset="offset" :group="group" />
<menu-script v-if="isTask" ref="menuScript" :offset="offset" :group="group" />
<menu-script v-if="isScript" ref="menuScript" :offset="offset" :group="group" />
<menu-schema
v-if="isDemon || isPlan || isTask "
v-if="isDemon || isPlan || isScript "
ref="menuSchema"
:offset="offset"
:group="group"
@ -40,7 +40,7 @@
@switchMode="switchMode"
/>
<menu-system-time ref="menuSystemTime" :offset="offset" :group="group" />
<menu-system-time ref="menuSystemTime" :offset="offset" :right="right" :group="group" />
</div>
<Jl3d-Simulation v-show="simulationShow" ref="Jl3dSimulation" :panel-show="simulationShow" @showpanel="showpanel" />
@ -122,6 +122,7 @@ export default {
timeDemonNum: 0,
checkLine: null,
offset: 15,
right: 0,
mouseNum: 1,
ierval: null,
mouseNumTime: 0,
@ -181,7 +182,7 @@ export default {
isReplay() {
return this.mode === 'replay';
},
isTask() {
isScript() {
return this.mode === 'script';
},
isPlan() {
@ -246,6 +247,7 @@ export default {
const width = this.size ? this.size.width : this._clientWidth;
const height = this.size ? this.size.height : this._clientHeight;
this.right = width /2 - 55;
this.$store.dispatch('config/resize', { width, height });
this.$nextTick(() => {
@ -340,13 +342,12 @@ export default {
},
// 加载地图数据
async initLoadData() {
// const width = document.documentElement.clientWidth;
// const height = document.documentElement.clientHeight + 200;
// this.$store.dispatch('config/resize', { width, height });
this.$store.dispatch('training/reset');
try {
await this.loadSimulationInfo();
if (!this.isReplay) {
await this.loadSimulationInfo();
}
if (this.isReplay) {
await this.initLoadReplayData();
@ -356,7 +357,7 @@ export default {
await this.initLoadScreenData();
} else if (this.isPlan) {
await this.initLoadTestRunData();
} else if (this.isTask) {
} else if (this.isScript) {
await this.initLoadTaskData();
} else {
await this.initLoadLessonOrExamData();
@ -524,7 +525,7 @@ export default {
await this.$refs.menuScreen.back();
} else if (this.isPlan) {
await this.$refs.menuPlan.back();
} else if (this.isTask) {
} else if (this.isScript) {
await this.$refs.menuScript.back();
}
},

7
src/views/display/menuReplay.vue
View File

@ -62,7 +62,7 @@ export default {
startLoading: false,
speed: '1X',
level: 1,
isPlay: true,
isPlay: false,
time: '',
timeInterval: null,
progress: 0,
@ -95,6 +95,11 @@ export default {
return this.isPlay ? '暂停' : '播放';
}
},
watch: {
'$store.state.map.mapViewLoadedCount': function() {
this.isPlay = true;
}
},
mounted() {
EventBus.$emit('showChat');
this.time = (+new Date(this.$route.query.destroyTime) - +new Date(this.$route.query.createTime)) / 1000;

10
src/views/display/menuSchema.vue
View File

@ -7,9 +7,9 @@
<el-button-group>
<el-button v-if="isDemon" size="small" :disabled="viewDisabled" type="success" @click="viewRunQuest">加载剧本
</el-button>
<el-button v-if="runing" size="small" :disabled="viewDisabled" @click="viewRunPlan">运行图预览</el-button>
<el-button v-if="notScript && runing" size="small" :disabled="viewDisabled" @click="viewRunPlan">运行图预览</el-button>
<el-button
v-if="!runing && !isPlan"
v-if="!runing && !isPlan && notScript"
size="small"
:disabled="viewDisabled"
type="warning"
@ -59,11 +59,15 @@ export default {
...mapGetters('runPlan', [
'stations'
]),
notScript() {
return this.$route.params.mode !== 'script';
},
isPlan() {
return this.$route.params.mode === 'plan';
},
isScript() {
return this.$route.params.mode === 'script';
// return this.$route.params.mode === 'script';
return false;
},
isDemon() {
return this.$route.params.mode === 'demon';

74
src/views/display/menuSystemTime.vue
View File

@ -1,18 +1,22 @@
<template>
<div v-if="isShowSystemTime" class="display-card" :style="{top: offset+'px'}">
<system-time
v-if="isShowSystemTime"
class="time"
:time="time"
:zoom="1.3"
:width="110"
:height="32"
:fine="2"
:top="2"
/>
<div v-if="isShowSystemTime" class="display-card" :style="{top: offset+'px', right: right+'px'}">
<template v-if="pause">
<span class="display-pause">暂停中</span>
</template>
<template v-else>
<system-time
class="display-time"
:time="time"
:zoom="1.3"
:width="110"
:height="32"
:fine="2"
:top="2"
/>
</template>
</div>
</template>
<script>
import { prefixIntrger } from '@/utils/date';
import SystemTime from '@/views/components/systemTime/index';
@ -26,6 +30,10 @@ export default {
offset: {
type: Number,
required: true
},
right: {
type: Number,
required: true
}
},
data() {
@ -35,7 +43,14 @@ export default {
},
computed: {
isShowSystemTime() {
return this.$route.params.mode == 'demon' || this.$route.params.mode == 'dp' || this.$route.params.mode == 'plan' || !this.$route.params.mode;
return this.$route.params.mode == 'demon' ||
this.$route.params.mode == 'dp' ||
this.$route.params.mode == 'plan' ||
this.$route.params.mode == 'script' ||
!this.$route.params.mode;
},
pause() {
return this.$store.state.socket.simulationPause;
}
},
watch: {
@ -53,34 +68,21 @@ export default {
z-index: 9;
display: inline;
position: absolute;
}
.display-pause {
font-size: 21px;
font-weight: bold;
color: yellow;
}
.display-time{
border: 2px solid white;
border-radius: 4px;
left: calc(50% - 55px);
}
}
.display-card .el-row {
line-height: 32px !important;
}
.display-score {
background-color: white;
display: -moz-inline-box;
display: inline-block;
text-align: left;
height: 32px;
line-height: 24px;
border-radius: 4px;
padding-left: 2px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: #fff;
}
.display-draft {
position: absolute;
float: right;
right: 40px;
bottom: 28px;
}
</style>

34
src/views/package/index.vue
View File

@ -27,19 +27,19 @@ export default {
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '120px',
labelWidth: '140px',
reset: true,
queryObject: {
'type': {
type: 'select',
label: '权限类型',
label: this.$t('permission.permissionType'),
config: {
data: []
}
},
'status': {
type: 'select',
label: '权限状态',
label: this.$t('permission.permissionStatus'),
value: '1',
config: {
data: []
@ -47,7 +47,7 @@ export default {
},
'canDistribute': {
type: 'select',
label: '公用/专用',
label: this.$t('permission.permissionUseType'),
config: {
data: []
}
@ -60,26 +60,26 @@ export default {
indexShow: true,
columns: [
{
title: '权限类型',
title: this.$t('permission.permissionType'),
prop: 'type',
type: 'tag',
columnValue: (row) => { return this.$convertField(row.type, this.PermissionTypeList, ['value', 'label']); },
tagType: (row) => { return ''; }
},
{
title: '地图名称',
title: this.$t('permission.mapName'),
prop: 'mapName'
},
{
title: '地图产品名称',
title: this.$t('permission.mapProductName'),
prop: 'mapProductName'
},
{
title: '课程名称',
title: this.$t('permission.lessonName'),
prop: 'lessonName'
},
{
title: '公用/专用',
title: this.$t('permission.permissionUseType'),
prop: 'canDistribute',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.canDistribute, 'PermissionUseList'); },
@ -91,7 +91,7 @@ export default {
}
},
{
title: '是否永久',
title: this.$t('permission.isForever'),
prop: 'forever',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.forever, 'Whether'); },
@ -103,33 +103,33 @@ export default {
}
},
{
title: '权限总数',
title: this.$t('permission.permissionTotal'),
prop: 'amount'
},
{
title: '剩余权限数量',
title: this.$t('permission.permissionRemains'),
prop: 'remains'
},
{
title: '开始时间',
title: this.$t('permission.startTime'),
prop: 'startTime',
type: 'formatter',
formatter: this.formatterDate
},
{
title: '结束时间',
title: this.$t('permission.endTime'),
prop: 'endTime',
type: 'formatter',
formatter: this.formatterDate
},
{
title: '权限归属人',
title: this.$t('permission.belonger'),
prop: 'ownerName',
isShow: () => { return this.$store.state.user.roles.indexOf(superAdmin) != -1; }
},
{
title: '权限状态',
title: this.$t('permission.permissionStatus'),
prop: 'status',
type: 'tag',
columnValue: (row) => { return this.$convertField(row.status, this.EffectiveTypeList, ['value', 'label']); },
@ -147,7 +147,7 @@ export default {
hide: () => { return this.$store.state.user.roles.indexOf(superAdmin) < 0; },
buttons: [
{
name: this.$t('permission.belonger'),
name: this.$t('permission.setBelonger'),
handleClick: this.handleRoleVest,
type: ''
}

2
src/views/package/selectRole/list.vue
View File

@ -1,6 +1,6 @@
<template>
<el-dialog
title="用户列表"
:title="$t('permission.userList')"
:visible.sync="show"
top="20px"
width="90%"

4
src/views/replay/index.vue
View File

@ -21,11 +21,11 @@ export default {
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '80px',
labelWidth: '120px',
queryObject: {
mapName: {
type: 'text',
label: this.$t('global.mapName')
label: this.$t('replay.mapName')
}
}
},