房间添加任务管理
This commit is contained in:
wangchengming
parent
ab575b6592
commit
67363b79aa
|
|
@ -156,12 +156,14 @@
|
|||
<a-radio-group v-model="modelInfoType" button-style="solid">
|
||||
<a-radio-button value="jcsx">基础属性</a-radio-button>
|
||||
<a-radio-button value="zzxd">作战行动</a-radio-button>
|
||||
<a-radio-button value="bzrw">保障任务</a-radio-button>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
<div class="normal" style="padding: 15px 0">
|
||||
<div style="height: 100%; padding: 0 15px; overflow-y: auto">
|
||||
<Jcsx v-if="modelInfoType === 'jcsx'" :scenarioId="scenarioId" :modelData="jcsx.data" />
|
||||
<Zzxd v-if="modelInfoType === 'zzxd'" :actionList="zzxd.data" />
|
||||
<BzTask v-if="modelInfoType === 'bzrw'" :scenarioId="scenarioId" :resourceid="resourceid" :type="type" />
|
||||
</div>
|
||||
</div>
|
||||
</ModuleWrapper>
|
||||
|
|
@ -173,14 +175,18 @@
|
|||
import { getAction, postAction } from '@/api/manage'
|
||||
import Jcsx from '../simulationModel/Jcsx.vue'
|
||||
import Zzxd from '../simulationModel/Zzxd.vue'
|
||||
import BzTask from '../simulationModel/BzTask.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Jcsx,
|
||||
Zzxd,
|
||||
BzTask
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
resourceid: null, // 分队id
|
||||
type: null, // 红蓝类型
|
||||
scenarioId: '',
|
||||
scenarioDetail: {},
|
||||
zzbzll: {
|
||||
|
|
@ -443,6 +449,8 @@ export default {
|
|||
handleSelectZzbzll(selectedKeys, { node }) {
|
||||
this.cesium.setClientByCenter({ longitude: +node.dataRef.lng, latitude: +node.dataRef.lat })
|
||||
this.blbz.modelData = node.dataRef
|
||||
this.resourceid = node.dataRef.id
|
||||
this.type = node.dataRef.type
|
||||
this.getBlbzTreeData()
|
||||
this.getJcsxData()
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,233 @@
|
|||
<template>
|
||||
<Flex fd="co" class="zzxd-wrapper">
|
||||
<Flex class="zzxd-header" ai="c" jc="sb">
|
||||
<div class="zzxd-title">保障任务</div>
|
||||
<div>
|
||||
<a-button type="text-primary" icon="menu"></a-button>
|
||||
<a-button type="text-primary" icon="plus" @click="handleOpenAddActionModal"></a-button>
|
||||
<a-button type="text-primary" icon="edit" @click="handleOpenEditActionModal"></a-button>
|
||||
<a-button type="text-primary" icon="delete" @click="handleDeleteAction"></a-button>
|
||||
</div>
|
||||
<a-modal
|
||||
v-model="actionModal.visible"
|
||||
:title="actionModal.title" :maskClosable="false" :destroyOnClose="true"
|
||||
@ok="handleSubmilAction">
|
||||
<a-form-model
|
||||
:model="actionModal.formData"
|
||||
layout="horizontal" :labelCol="{ span: 6 }"
|
||||
:wrapperCol="{ span: 15 }">
|
||||
<a-form-model-item v-for="item in actionModal.formItems" :key="item.prop" v-bind="item">
|
||||
<component
|
||||
:is="item.component || 'a-input'"
|
||||
v-model="actionModal.formData[item.prop]"
|
||||
v-bind="item.options" />
|
||||
</a-form-model-item>
|
||||
</a-form-model>
|
||||
</a-modal>
|
||||
</Flex>
|
||||
<div class="flex-1 scroller-y">
|
||||
<div v-for="item in actionList" :key="item.id" class="action-item flex" @click="checkedAction = item">
|
||||
<div class="action-icon">
|
||||
<div class="action-line"></div>
|
||||
<a-radio :checked="checkedAction && checkedAction.id === item.id" style="margin-right: 0"></a-radio>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<div class="action-title">{{ item.name || '- -' }}</div>
|
||||
<div class="action-time">任务类型：{{ handleGetTaskType(item.taskType) }}</div>
|
||||
<div class="action-time">开始时间：{{ item.startTime }}</div>
|
||||
<div class="action-time">结束时间：{{ item.endTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Flex>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
scenarioId: { type: String, required: true },
|
||||
resourceid: { type: String, required: true },
|
||||
type: { type: Number, required: true },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checkedAction: null,
|
||||
actionModal: {
|
||||
visible: false,
|
||||
formItems: [
|
||||
{ label: '任务名称', prop: 'name' },
|
||||
{
|
||||
label: '任务类型',
|
||||
prop: 'taskType',
|
||||
component: 'AntOriginSelect',
|
||||
options: {
|
||||
dataSource: () => ({
|
||||
data: [
|
||||
{ id: '1', title: '机动任务' },
|
||||
{ id: '2', title: '战斗任务' },
|
||||
{ id: '3', title: '整备任务' },
|
||||
{ id: '4', title: '弹药保障' },
|
||||
{ id: '5', title: '水保障' },
|
||||
{ id: '6', title: '油保障' },
|
||||
{ id: '7', title: '食品保障' }
|
||||
],
|
||||
}),
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '开始时间', prop: 'startTime', component: 'a-date-picker', options: {
|
||||
showTime: true,
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '结束时间', prop: 'endTime', component: 'a-date-picker', options: {
|
||||
showTime: true,
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss'
|
||||
}
|
||||
},
|
||||
{ label: '开始经度', prop: 'fromLng' },
|
||||
{ label: '开始纬度', prop: 'fromLat' },
|
||||
{ label: '目标经度', prop: 'toLng' },
|
||||
{ label: '目标纬度', prop: 'toLat' },
|
||||
],
|
||||
formData: {},
|
||||
},
|
||||
actionList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.scenarioId && this.resourceid) {
|
||||
this.handleGetTaskList()
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
resourceid: {
|
||||
handler(newValue, oldValue) {
|
||||
this.handleGetTaskList()
|
||||
},
|
||||
deep: true // 重要：开启深层监听
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleGetTaskType(type) {
|
||||
switch (type) {
|
||||
case '1':
|
||||
return '机动任务'
|
||||
case '2':
|
||||
return '战斗任务'
|
||||
case '3':
|
||||
return '整备任务'
|
||||
case '4':
|
||||
return '弹药保障'
|
||||
case '5':
|
||||
return '水保障'
|
||||
case '6':
|
||||
return '油保障'
|
||||
case '7':
|
||||
return '食品保障'
|
||||
default:
|
||||
return '- -'
|
||||
}
|
||||
},
|
||||
handleGetTaskList() {
|
||||
this.$http({
|
||||
url: '/scenarioTask/taskList',
|
||||
method: 'post',
|
||||
data: { scenarioId: parseInt(this.scenarioId), resourceId: this.resourceid },
|
||||
}).then(res => {
|
||||
this.actionList = res.data
|
||||
})
|
||||
},
|
||||
handleOpenAddActionModal() {
|
||||
this.actionModal.title = '添加任务'
|
||||
this.actionModal.formData = {
|
||||
type: this.type,
|
||||
scenarioId: parseInt(this.scenarioId),
|
||||
resourceId: this.resourceid
|
||||
}
|
||||
this.actionModal.visible = true
|
||||
},
|
||||
handleOpenEditActionModal() {
|
||||
this.actionModal.title = '修改任务'
|
||||
this.actionModal.formData = { ...this.checkedAction }
|
||||
this.actionModal.visible = true
|
||||
},
|
||||
async handleSubmilAction() {
|
||||
try {
|
||||
await this.$http({
|
||||
url: '/scenarioTask/save',
|
||||
method: 'post',
|
||||
data: this.actionModal.formData,
|
||||
})
|
||||
this.$message.success(`${this.actionModal.title}成功`)
|
||||
this.actionModal.visible = false
|
||||
this.handleGetTaskList()
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
async handleDeleteAction() {
|
||||
try {
|
||||
await this.$confirm('确认删除所选任务吗？')
|
||||
await this.$http({
|
||||
url: '/scenarioTask/remove/' + this.checkedAction.id,
|
||||
method: 'get'
|
||||
})
|
||||
this.$message.success(`删除任务成功`)
|
||||
this.handleGetTaskList()
|
||||
} catch (error) {
|
||||
this.$message.success(`删除任务失败`)
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.zzxd-wrapper {
|
||||
height: 100%;
|
||||
|
||||
.zzxd-header {
|
||||
padding: 5px 0;
|
||||
border-bottom: 1px solid #00baff22;
|
||||
|
||||
.zzxd-title {
|
||||
color: #00baff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.action-item {
|
||||
cursor: pointer;
|
||||
padding: 5px 0;
|
||||
|
||||
.action-icon {
|
||||
padding: 5px 16px;
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
|
||||
.action-line {
|
||||
position: absolute;
|
||||
right: 50%;
|
||||
top: 21px;
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
background-color: #00baff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.action-item:last-of-type {
|
||||
.action-line {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.action-item:hover {
|
||||
background-color: #bae7ff44;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -136,12 +136,14 @@
|
|||
<a-radio-group v-model="modelInfoType" button-style="solid">
|
||||
<a-radio-button value="jcsx">基础属性</a-radio-button>
|
||||
<a-radio-button value="zzxd">作战行动</a-radio-button>
|
||||
<a-radio-button value="bzrw">保障任务</a-radio-button>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
<div class="normal" style="padding: 15px 0">
|
||||
<div style="height: 100%; padding: 0 15px; overflow-y: auto">
|
||||
<Jcsx v-if="modelInfoType === 'jcsx'" :scenarioId="scenarioId" :modelData="jcsx.data" />
|
||||
<Zzxd v-if="modelInfoType === 'zzxd'" :actionList="zzxd.data" />
|
||||
<BzTask v-if="modelInfoType === 'bzrw'" :scenarioId="scenarioId" :resourceid="resourceid" :type="type" />
|
||||
</div>
|
||||
</div>
|
||||
</ModuleWrapper>
|
||||
|
|
@ -153,6 +155,7 @@
|
|||
import { getAction, postAction } from '@/api/manage'
|
||||
import Jcsx from './Jcsx.vue'
|
||||
import Zzxd from './Zzxd.vue'
|
||||
import BzTask from './BzTask.vue'
|
||||
|
||||
export default {
|
||||
// props: {
|
||||
|
|
@ -161,9 +164,12 @@ export default {
|
|||
components: {
|
||||
Jcsx,
|
||||
Zzxd,
|
||||
BzTask
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
return {
|
||||
resourceid: null, // 分队id
|
||||
type: null, // 红蓝类型
|
||||
scenarioId: '',
|
||||
qd: {
|
||||
qdlx: 'xqqd',
|
||||
|
|
@ -446,7 +452,9 @@ export default {
|
|||
|
||||
handleSelectZzbzll(selectedKeys, { node }) {
|
||||
this.cesium.setClientByCenter({ longitude: +node.dataRef.lng, latitude: +node.dataRef.lat })
|
||||
this.blbz.modelData = node.dataRef
|
||||
this.blbz.modelData = node.dataRef
|
||||
this.resourceid = node.dataRef.id
|
||||
this.type = node.dataRef.type
|
||||
this.getBlbzTreeData()
|
||||
this.getJcsxData()
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user