Commit c925ef3a authored by 旭艳's avatar 旭艳

指令下达页面开发

parent ef1ce3cb
<template>
<div class="instructions-issued">
<dee-search-server
v-model="searchFormData"
:show-reset-btn="false"
:show-search-btn="false"
class="instructions-search-box"
:form-data="seachForm"
/>
<div class="instructions-issued-top">
<el-form :inline="true" :model="searchFormData" class="instructions-issued-search" label-width="50px">
<el-col :span="12">
<el-form-item label="站位:">
<el-select v-model="searchFormData.postion" placeholder="站位" @change="changePostion">
<el-option
v-for="(item, i) in postionList"
:key="item.value + i"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="架次:">
<el-select v-model="searchFormData.sorties" placeholder="架次" @change="changeSorties">
<el-option
v-for="(item, i) in sortiesData"
:key="item.value + i"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-form>
<span class="start-working">
<img :src="wordImgUrl" alt="" :title="title">
</span>
</div>
<split-pane
:min-percent="18"
:default-percent="75"
:default-percent="80"
split="vertical"
class="detail-pane"
>
<template slot="paneL">
<dee-tab :tabs="tabItems" :show-swipe="false" :is-detail="false">
<dee-tab :tabs="tabItems" @tabClick="tabClick">
<div slot="0" style="height:100%;box-sizing:border-box">
<dee-as-com
ref="detailCom"
ref="detailComTo"
:key="layConfig.typeName"
:lay-config="layConfig"
:form="searchFormData"
/>
</div>
<div slot="1" style="height:100%;box-sizing:border-box">
<dee-as-com
ref="detailCom"
ref="detailComAlready"
:key="layConfigAlready.typeName"
:lay-config="layConfigAlready"
:form="searchFormData"
/>
</div>
</dee-tab>
</template>
<template slot="paneR">
<div class="sub-title">
班组
<div class="sub-title" style="margin:0 10px">
班组
</div>
<el-select v-model="group" size="small" placeholder="请选择" style="width:100%" @change="selectGroup">
<el-select v-model="group" size="small" placeholder="请选择" style="width:86%;margin:10px" @change="changeGroup">
<el-option
v-for="item in groupList"
v-for="item in groupDropList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<div class="group-list">
<div v-for="(item, index) in groupList" :key="index" class="group-list-box" :class="{'active': group===item.id}">
<div class="left">
<img
:src="item.url"
style="cursor:pointer"
>
<div class="left-text"> {{ item.groupName }}</div>
</div>
<div class="right">
<div><span>未完成任务:</span><span>{{ item.undoTask }}</span></div>
<div class="right-text "><span>工种:</span><span>{{ item.workType }}</span></div>
</div>
</div>
</div>
</template>
</split-pane>
</div>
......@@ -54,32 +95,12 @@ export default {
return {
sortiesData: [],
postionList: [],
seachForm: [
{
key: 'sorties',
title: '架次',
component: {
name: 'el-select',
options: this.sortiesData,
clearable: true
}
},
{
key: 'postion',
title: '站位',
component: {
name: 'el-select',
options: this.postionList,
clearable: true
}
}
],
searchFormData: {
sorties: '',
postion: ''
},
group: '',
groupList: [
groupDropList: [
{
label: '班组1',
value: 1
......@@ -88,18 +109,43 @@ export default {
label: '班组2',
value: 2
}
]
],
groupList: [{
id: 1,
url: 'icons/plus.png',
groupName: '班组1',
workType: '111',
undoTask: '1项/4h'
}, {
id: 2,
url: 'icons/plus.png',
groupName: '班组2',
workType: '111',
undoTask: '1项/4h'
}, {
id: 3,
url: 'icons/plus.png',
groupName: '班组3',
workType: '111',
undoTask: '1项/4h'
}],
tableData: [],
activeName: 0,
// 开工状态
status: null,
title: '未开工',
wordImgUrl: '/icons/startWork1.png'
}
},
computed: {
tabItems() {
return [
{
name: '待下',
name: '待下',
id: '0'
},
{
name: '已下',
name: '已下',
id: '1'
}
]
......@@ -118,81 +164,164 @@ export default {
}
},
watch: {
'searchFormData.sorties': {
immediate: true,
handler(val) {
const sorties = this.sortiesData.find(r => r.value === val)
this.$set(this.searchFormData, 'sortiesName', sorties && sorties.sortiesName || '')
this.$utils.getDicListByCode('SoriteType').then(res => {
this.SoriteTypeOptions = res
this.getStation(val)
})
}
},
'searchFormData.postion': {
immediate: true,
status: {
handler(val) {
const postion = this.postionList.find(r => r.value === val)
this.$set(this.searchFormData, 'postionName', postion && postion.label || '')
}
if (val === 'New') {
this.wordImgUrl = '/icons/startWork1.png'
this.title = '未开工'
} else if (val === 'Run') {
this.wordImgUrl = '/icons/startWork2.png'
this.title = '已开工'
} else {
this.wordImgUrl = '/icons/startWork1.png'
this.title = '未开工'
}
},
deep: true
}
},
created() {
this.getSortiesList()
this.getStation()
},
methods: {
getSortiesList() {
this.sortiesData = []
const params = { 'searchItems': { 'items': [] }, 'sortItem': [{ 'fieldName': 'modifyTime', 'sortOrder': 'asc' }] }
params.openProps = [{ name: 'target' }, { name: 'source' }]
this.$api.searchApi('SoritesLink', params).then(res => {
const params = {
'searchItems': {
'children': [
{
'items': [
{
'fieldName': 'extPosition.serialNumber',
'operator': 'EQ',
'value': this.searchFormData.postionName
}
],
'operator': 'AND'
}
],
'items': [],
'operator': 'AND'
},
'openProps': [
{
'name': 'extPosition',
'searchItems': {
'items': [
{
'fieldName': 'serialNumber',
'operator': 'EQ',
'value': this.searchFormData.postionName
}
],
'operator': 'AND'
},
'openProps': [
{
'name': 'extPositionPlans'
}
]
}
],
'sortItem': [
{
'fieldName': 'modifyTime',
'sortOrder': 'desc'
}
],
'toValidateKeys': ''
}
post('/AircraftSorties/search', params).then(res => {
if (res.items && res.items.content) {
this.sortiesData = res.items.content.map(row => {
return {
value: `${row.sourceId}:${row.targetId}`,
label: this.getSoritesLabel(row),
sortiesName: row.source.defName
value: row.defCode,
label: row.defName
}
})
this.$set(this.seachForm[0].component, 'options', this.sortiesData)
this.$set(this.searchFormData, 'sorties', this.sortiesData[0].value)
this.$set(this.searchFormData, 'sortiesName', this.sortiesData[0].sortiesName)
this.getStation()
this.$set(this.searchFormData, 'sortiesName', this.sortiesData[0].label)
this.getTableData()
}
})
},
getSoritesLabel(row) {
const type = (row.target && row.target.type) ? this.SoriteTypeOptions.find(r => r.value === row.target.type) : ''
return `${row.source.defName} ${type && type.label || ''}`
},
getStation(val) {
getStation() {
this.postionList = []
this.$set(this.searchFormData, 'postion', '')
if (val) {
const sortiesId = val.split(':')[0]
const sortiesTypeId = val.split(':').slice(-1)[0]
const params = {
'searchItems': { 'items': [{ 'fieldName': 'aircraftSortiesId', 'operator': 'EQ', 'value': sortiesId }, { 'fieldName': 'soritesTypeId', 'operator': 'EQ', 'value': sortiesTypeId }] },
'openProps': [{ name: 'aircraftSorties' }],
'sortItem': [{ 'fieldName': 'serialNumber', 'sortOrder': 'asc' }]
}
post('ExtPosition/search', params).then(res => {
if (res.items && res.items.content) {
this.postionList = res.items.content.map(row => {
return {
value: `${row.id}`,
label: row.serialNumber
}
})
this.$set(this.seachForm[1].component, 'options', this.postionList)
this.$set(this.searchFormData, 'postion', this.postionList[0].value)
this.$set(this.searchFormData, 'postionName', this.postionList[0].label)
// const userId = localStorage.getItem('userId') || ''
const params = {
'searchItems': {
'children': [
{
'items': [
{
'fieldName': 'targetId',
'operator': 'EQ',
'value': 1626782149352
}
],
'operator': 'AND'
}
],
'items': [],
'operator': 'AND'
},
'openProps': [
{
'name': 'source'
}
],
'sortItem': [
{
'fieldName': 'modifyTime',
'sortOrder': 'desc'
}
})
],
'toValidateKeys': ''
}
post('/ExtPositionUserLink/search', params).then(res => {
if (res.items && res.items.content) {
this.postionList = res.items.content.map(row => {
return {
value: row.source.extname,
label: row.source.extcode
}
})
this.$set(this.searchFormData, 'postion', this.postionList[0].value)
this.$set(this.searchFormData, 'postionName', this.postionList[0].label)
this.getSortiesList()
}
})
},
changePostion() {
const postion = this.postionList.find(r => r.value === this.searchFormData.postion)
this.$set(this.searchFormData, 'postionName', postion && postion.label || '')
this.getSortiesList()
},
changeSorties() {
const sorties = this.sortiesData.find(r => r.value === this.searchFormData.sorties)
this.$set(this.searchFormData, 'sortiesName', sorties && sorties.label || '')
this.getTableData()
},
tabClick(tab) {
this.activeName = tab.index
this.getTableData()
},
getTableData() {
if (this.activeName === '1') {
if (this.$refs.detailComAlready) {
this.$refs.detailComAlready.$children[0].getData()
}
} else {
this.$refs.detailComTo.$children[0].getData()
}
},
selectGroup() {
changeGroup() {
this.groupList.map((item, index) => {
if (item.id === this.group) {
this.groupList.unshift(this.groupList.splice(index, 1)[0])
}
})
}
}
}
......@@ -201,12 +330,54 @@ export default {
.instructions-issued{
background: #ffff;
height: 100%;
.instructions-search-box{
margin-bottom: 0;
padding: 8px 0 0 8px;
.el-form-item{
margin-bottom: 10px;
}
.group-list{
height: calc(100% - 130px);
overflow-y: scroll;
margin-bottom: 20px;
.group-list-box{
background: #f3f6f7;
padding: 20px;
margin: 10px 20px;
display: flex;
border-radius: 10px;
justify-content: space-between;
align-items: center;
font-size: 14px;
.left{
img{
width: 40px;
height: 50px;
}
.left-text{
font-size: 14px;
font-weight: 500;
}
}
.right{
.right-text{
padding-top: 16px;
}
}
}
.active{
background: #3590BE;
}
}
.instructions-issued-top{
display: flex;
align-items: center;
.instructions-issued-search {
padding: 10px 8px;
height: 40px;
width: 40%;
}
.start-working{
height: 30px;
cursor: pointer;
img{
height: 100%;
};
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment