指令下达页面开发

applications/dee-mes/src/views/assemblyPlanManagement/instructionsIssued/index.vue

+<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"
+    />
+    <split-pane
+      :min-percent="18"
+      :default-percent="75"
+      split="vertical"
+      class="detail-pane"
+    >
+      <template slot="paneL">
+        <dee-tab :tabs="tabItems" :show-swipe="false" :is-detail="false">
+          <div slot="0" style="height:100%;box-sizing:border-box">
+            <dee-as-com
+              ref="detailCom"
+              :key="layConfig.typeName"
+              :lay-config="layConfig"
+            />
+          </div>
+          <div slot="1" style="height:100%;box-sizing:border-box">
+            <dee-as-com
+              ref="detailCom"
+              :key="layConfigAlready.typeName"
+              :lay-config="layConfigAlready"
+            />
+          </div>
+        </dee-tab>
+      </template>
+      <template slot="paneR">
+        <div class="sub-title">
+          下达班组
+        </div>
+        <el-select v-model="group" size="small" placeholder="请选择" style="width:100%" @change="selectGroup">
+          <el-option
+            v-for="item in groupList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </template>
+    </split-pane>
+  </div>
+</template>
+<script>
+import { post } from '@/utils/http'
+export default {
+  data() {
+    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: [
+        {
+          label: '班组1',
+          value: 1
+        },
+        {
+          label: '班组2',
+          value: 2
+        }
+      ]
+    }
+  },
+  computed: {
+    tabItems() {
+      return [
+        {
+          name: '待下达',
+          id: '0'
+        },
+        {
+          name: '已下达',
+          id: '1'
+        }
+      ]
+    },
+    layConfig() {
+      return {
+        typeName: 'JoExecutePlan',
+        layKey: 'instructionsIssuedListTo'
+      }
+    },
+    layConfigAlready() {
+      return {
+        typeName: 'JoExecutePlan',
+        layKey: 'instructionsIssuedListAlready'
+      }
+    }
+  },
+  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,
+      handler(val) {
+        const postion = this.postionList.find(r => r.value === val)
+        this.$set(this.searchFormData, 'postionName', postion && postion.label || '')
+      }
+    }
+  },
+  created() {
+    this.getSortiesList()
+  },
+  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 => {
+        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
+            }
+          })
+          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()
+        }
+      })
+    },
+    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) {
+      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)
+          }
+        })
+      }
+    },
+    selectGroup() {
+
+    }
+  }
+}
+</script>
+<style lang="scss">
+.instructions-issued{
+  background: #ffff;
+  height: 100%;
+  .instructions-search-box{
+    margin-bottom: 0;
+    padding: 8px 0 0 8px;
+   .el-form-item{
+    margin-bottom: 10px;
+   }
+  }
+}
+</style>