单架次MBOM配置

applications/dee-mes/src/privateComponents/components/MBOMConfig/gatt.vue

 <template>
-  <div class="">
-    <el-button-group>
-      <el-button :type="viewType==='ExtPosition'?'primary':''" @click="setView('ExtPosition')">站位路线</el-button>
-      <el-button :type="viewType==='unit'?'primary':''" @click="setView('unit')">装配单元路线</el-button>
-      <el-button :type="viewType==='AircraftSorties'?'primary':''" @click="setView('AircraftSorties')">架次视图路线</el-button>
-    </el-button-group>
+  <div class="TfMomWebGatt-page">
+    <div class="btn-bar">
+      <el-radio-group v-model="viewType" size="small" @input="setView">
+        <el-radio-button label="ExtPosition">站位路线</el-radio-button>
+        <el-radio-button label="unit">装配单元路线</el-radio-button>
+        <el-radio-button label="AircraftSorties">架次视图路线</el-radio-button>
+      </el-radio-group>
+      <dee-tools mode="normal" :tools="tools" />
+    </div>
+    <div class="content-model">
+      <step v-show="viewType === 'ExtPosition'" />
+      <unit v-show="viewType === 'unit'" />
+      <view2 v-show="viewType === 'AircraftSorties'" />
+    </div>
   </div>
 </template>
 
 <script>
+import step from './step.vue'
+import unit from './unit.vue'
+import view2 from './view.vue'
 export default {
   componentName: '单架次MBOM甘特图',
   name: 'TfMomWebGatt',
-
+  components: { step, unit, view2 },
   data() {
     return {
       viewType: 'ExtPosition',
@@ -30,7 +41,53 @@ export default {
       ]
     }
   },
-
+  computed: {
+    tools() {
+      const btns = [{
+        name: '导出',
+        icon: '/icons/c-export.png',
+        handler: {
+          click: () => {
+            this.import()
+          }
+        }
+      }]
+      if (this.viewType === 'AircraftSorties') {
+        return btns
+      }
+      if (this.viewType === 'ExtPosition') {
+        btns.unshift({
+          name: '保存',
+          icon: '/icons/c-export.png',
+          handler: {
+            click: () => {
+              this.save()
+            }
+          }
+        })
+        return btns
+      }
+      btns.unshift({
+        name: '设置排序',
+        icon: '/icons/check.png',
+        handler: {
+          click: () => {
+            this.config()
+          }
+        }
+      })
+      btns.unshift({
+        name: '保存',
+        icon: '/icons/c-export.png',
+        handler: {
+          click: () => {
+            this.save()
+          }
+        }
+      })
+      return btns
+    }
+  },
   mounted() {
 
   },
@@ -39,11 +96,30 @@ export default {
     setView(type) {
       this.viewType = type
       this.$emit('changeView', this.viewType)
+    },
+    getData(params) {
+      console.log(params)
+    },
+    import() {
+
+    },
+    save() {
+
+    },
+    config() {
+
     }
   }
 }
 </script>
 
-<style lang="scss" scoped>
-
+<style lang="scss">
+.TfMomWebGatt-page{
+ height: 100%;
+ .btn-bar{
+  height: 40px;
+  display: flex;
+  justify-content: space-between;
+ }
+}
 </style>

applications/dee-mes/src/privateComponents/components/MBOMConfig/step.vue

+<template>
+  <div>
+    站位路线
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TfMomWebStep',
+
+  data() {
+    return {
+
+    }
+  },
+
+  mounted() {
+
+  },
+
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

applications/dee-mes/src/privateComponents/components/MBOMConfig/tree.vue

 <template>
   <div class="TfMomWeb-tree">
     <el-tree
+      v-show="AircraftName"
+      ref="tree"
       :data="treeData"
       default-expand-all
       :props="props"
+      node-key="id"
+      :expand-on-click-node="false"
+      @node-click="nodeClick"
     >
-      <span slot-scope="{ node, data }" class="custom-tree-node">
+      <span slot-scope="{ node, data }" class="dee-as-tree-node" :class="{'disable-dee-as-tree-node': data.disabled, 'current':currentNode.id === data.id}">
         <i v-show="data.subTypeName==='aircraft'" class="el-icon-s-promotion" />
         <i v-show="data.subTypeName==='ExtPosition'" class="el-icon-s-tools" />
         <span>{{ node.label }}</span>
@@ -23,7 +28,8 @@ export default {
       AircraftName: '',
       AircraftSortiesId: '',
       AircraftSortiesName: '',
-      treeData: [],
+      currentNode: {},
+      postionList: [],
       viewType: 'ExtPosition',
       emitMethods: [
         {
@@ -42,22 +48,57 @@ export default {
         }
       ],
       props: {
-        disabled: (data) => {
-          console.log('ddddd')
-          if (this.viewType === 'ExtPosition') {
-            return data.subTypeName === 'ExtPosition'
-          }
-          return data.subTypeName === 'aircraft'
+        label: (data, node) => this.setLabel(data, node)
       }
     }
+  },
+  computed: {
+    treeData() {
+      return this.initTree(this.viewType, this.postionList)
     }
   },
-
   mounted() {
 
   },
 
   methods: {
+    initTree(type, postionList) {
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.defaultNodeClick()
+        }, 100)
+      })
+      return [{
+        id: 0,
+        subTypeName: 'aircraft',
+        serialNumber: `${this.AircraftName}-${this.AircraftSortiesName}`,
+        disabled: this.disableClickFun(type, { subTypeName: 'aircraft' }),
+        children: postionList.map(r => {
+          r.disabled = this.disableClickFun(type, r)
+          return r
+        })
+      }]
+    },
+    setLabel(data, node) {
+      return data.serialNumber
+    },
+    disableClickFun(type, data) {
+      if (type === 'unit') {
+        return data.subTypeName === 'aircraft'
+      }
+      return data.subTypeName === 'ExtPosition'
+    },
+    nodeClick(data, node) {
+      if (data.disabled) {
+        this.$refs.tree.setCurrentKey(null)
+        this.$nextTick(() => {
+          this.$refs.tree.setCurrentKey(this.currentNode.id)
+        })
+        return
+      }
+      this.currentNode = data
+      this.$emit('nodeClick', data)
+    },
     getData(params) {
       const items = params.items || params
       const AircraftType = items.find(r => r.fieldName === 'AircraftType')
@@ -85,26 +126,49 @@ export default {
 
       this.$api.searchApi('ExtPosition', params).then(res => {
         if (res.items.content) {
-          this.treeData = [{
-            id: '',
-            subTypeName: 'aircraft',
-            label: `${this.AircraftName}-${this.AircraftSortiesName}`,
-            children: res.items.content.map(r => {
-              r.label = r.serialNumber
-              return r
-            })
-          }]
+          this.postionList = res.items.content
+        } else {
+          this.postionList = []
         }
+      }).catch(() => {
+        this.postionList = []
       })
     },
     setNode(type) {
       this.viewType = type
+    },
+    defaultNodeClick() {
+      const tree = this.$refs.tree
+      if (!tree) {
+        return
+      }
+      const root = tree.getNode(0)
+      if (this.viewType === 'unit') {
+        this.currentNode = root.childNodes[0] && root.childNodes[0].data
+      } else {
+        this.currentNode = root.data
+      }
+      if (!this.currentNode) {
+        return
+      }
+      this.$nextTick(() => {
+        tree.setCurrentKey(this.currentNode.id)
+        this.$emit('node-click', this.currentNode)
+      })
     }
 
   }
 }
 </script>
 
-<style lang="scss" scoped>
-
+<style lang="scss">
+.TfMomWeb-tree{
+  .dee-as-tree-node{
+      width: 100%;
+      &.disable-dee-as-tree-node{
+        color: #ccc;
+        cursor: not-allowed;;
+      }
+    }
+}
 </style>

applications/dee-mes/src/privateComponents/components/MBOMConfig/unit.vue

+<template>
+  <div>
+    装配单元路线
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TfMomWebUnit',
+
+  data() {
+    return {
+
+    }
+  },
+
+  mounted() {
+
+  },
+
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

applications/dee-mes/src/privateComponents/components/MBOMConfig/view.vue

+<template>
+  <div>
+    架次视图路线
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TfMomWebView',
+
+  data() {
+    return {
+
+    }
+  },
+
+  mounted() {
+
+  },
+
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>