优化

src/api/crafts.js

@@ -29,3 +29,17 @@ export function getProduct (params) {
     params
   })
 }
+
+export function getWorkType () {
+  return request({
+    url: request.adornUrl(`/biz-service/workType/name/list`),
+    method: 'get'
+  })
+}
+
+export function getStepId () {
+  return request({
+    url: request.adornUrl(`/biz-service/technology/stepId/generate`),
+    method: 'get'
+  })
+}

src/views/modules/common/vue-super-flow/index.vue

@@ -77,12 +77,13 @@
       :position="menuConf.position"
       :list="menuConf.list"
       :source="menuConf.source">
-      <template v-slot="{item}">
+      <!-- <div>{{ item }}</div> -->
+      <!-- <template v-slot="{item}">
         <slot
           name="menuItem"
           :item="item">
         </slot>
-      </template>
+      </template> -->
     </graph-menu>
 
     <div

src/views/modules/common/vue-super-flow/utils.js

@@ -65,7 +65,7 @@ export function differ(pointA, pointB) {
 }
 
 export function minus(pointA, pointB) {
-  return [pointA[0] - pointB[0], pointA[1] - pointB[1]]
+  return [(pointA[0] || 0) - (pointB[0] || 0), (pointA[1] || 0) - (pointB[1] || 0)]
 }
 
 // 向量点积

src/views/modules/tech/crafts-management.vue

@@ -108,7 +108,7 @@
         min-width="100"
         label="当前状态">
         <template slot-scope="scope">
-          <span>{{ optionsState[Number(scope.row.state) + 1].value  }}</span>
+          <span>{{ scope.row.techState == '-1' ? '停用' : '启用' }}</span>
         </template>
       </el-table-column>
       <el-table-column
@@ -118,8 +118,8 @@
         width="100"
         label="操作">
         <template slot-scope="scope">
-          <el-button type="text" size="small" @click="addOrUpdateHandle1(scope.row.techId, scope.row.techState)">{{ scope.row.techState == 1 ? '启用' : '停用' }}</el-button>
-          <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.techId)">查看</el-button>
+          <el-button type="text" size="small" @click="addOrUpdateHandle1(scope.row.techId, scope.row.techState)">{{ scope.row.techState == -1 ? '启用' : '停用' }}</el-button>
+          <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.techId, true)">查看</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -133,7 +133,7 @@
       layout="total, sizes, prev, pager, next, jumper">
     </el-pagination>
     <!-- 弹窗, 新增 / 修改 -->
-    <ctafts-add-or-detail v-if="addOrUpdateVisible" ref="addOrUpdate" :refreshDataList="getTechnology" />
+    <ctafts-add-or-detail v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getTechnology" />
   </div>
 </template>
 
@@ -167,7 +167,7 @@
             code: '0', value: '正常'
           },
           {
-            code: '1', value: '停用'
+            code: '-1', value: '停用'
           }
         ],
         optionsCustomer: []
@@ -224,7 +224,7 @@
         })
       },
       addOrUpdateHandle1 (id, type) {
-        update({ techId: id, techState: type === 1 ? 0 : 1 }).then(({data}) => {
+        update({ techId: id, techState: type == -1 ? 0 : -1 }).then(({data}) => {
           if (data && data.code === '200') {
             this.getTechnology()
           }

src/views/modules/tech/ctafts-add-or-detail.vue

@@ -39,8 +39,9 @@
       </el-form-item>
       <el-form-item label="工艺步骤" prop="nodeList">
       </el-form-item>
-      <el-row class="my-row" style="height: 350px;">
+      <el-row class="my-row" style="height: 350px; background-color: #efefef;">
         <super-flow
+          v-if="visible"
           ref="superFlow"
           :node-list="nodeList"
           :link-list="linkList"
@@ -72,27 +73,66 @@
           @submit.native.prevent
           v-show="drawerConf.type === drawerType.node"
           ref="nodeSetting"
+          :rules="dataRule1"
           :model="nodeSetting">
-        <el-form-item
-            label="节点名称"
-            prop="name">
-          <el-input
-              v-model="nodeSetting.name"
-              placeholder="请输入节点名称"
-              maxlength="30">
-          </el-input>
-        </el-form-item>
-        <el-form-item
-            label="节点描述"
-            prop="desc">
-          <el-input
-              v-model="nodeSetting.desc"
-              placeholder="请输入节点描述"
-              maxlength="30">
-          </el-input>
-        </el-form-item>
+        <el-row class="my-row">
+          <el-col :span="24">
+            <el-form-item
+                label="节点名称"
+                prop="name">
+              <el-input
+                  v-model="nodeSetting.name"
+                  placeholder="请输入节点名称"
+                  maxlength="30">
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col v-if="drawerConf.prop != 'start' && drawerConf.prop != 'end'" :span="12">
+            <el-form-item
+                label="节点类型"
+                prop="type">
+                <el-select
+                  v-model="nodeSetting.type"
+                  placeholder="请选择">
+                <el-option
+                  v-for="item in optionsType"
+                  :key="item.value"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col v-if="drawerConf.prop != 'start' && drawerConf.prop != 'end'" :span="12">
+            <el-form-item
+              label="工种"
+              prop="workTypeId">
+              <el-select
+                v-model="nodeSetting.workTypeId"
+                placeholder="请选择">
+                <el-option
+                  v-for="item in optionsType1"
+                  :key="item.typeId"
+                  :label="item.name"
+                  :value="item.typeId">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item
+                label="节点备注"
+                prop="desc">
+              <el-input
+                  v-model="nodeSetting.desc"
+                  placeholder="请输入节点备注"
+                  maxlength="30">
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
       </el-form>
-      <el-form
+      <!-- <el-form
           @keyup.native.enter="settingSubmit"
           @submit.native.prevent
           v-show="drawerConf.type === drawerType.link"
@@ -106,7 +146,7 @@
               placeholder="请输入连线描述">
           </el-input>
         </el-form-item>
-      </el-form>
+      </el-form> -->
       <span
           slot="footer"
           class="dialog-footer">
@@ -125,7 +165,8 @@
 </template>
 
 <script>
-  import { getInfo, getProduct } from '@/api/crafts'
+  import { getInfo, getProduct, getWorkType, getStepId } from '@/api/crafts'
+  import { uuid } from '../common/vue-super-flow/utils'
   const drawerType = {
     node: 0,
     link: 1
@@ -140,9 +181,12 @@
     data () {
       return {
         drawerType,
+        optionsType: [{value: '1', name: '生产'}, {value: '2', name: '检验'}],
+        optionsType1: [],
         drawerConf: {
           title: '',
           visible: false,
+          prop: '',
           type: null,
           info: null,
           open: (type, info) => {
@@ -152,13 +196,16 @@
             conf.info = info
             if (conf.type === drawerType.node) {
               conf.title = '节点'
+              conf.prop = info.meta.prop
               if (this.$refs.nodeSetting) this.$refs.nodeSetting.resetFields()
               this.$set(this.nodeSetting, 'name', info.meta.name)
               this.$set(this.nodeSetting, 'desc', info.meta.desc)
+              this.$set(this.nodeSetting, 'type', info.meta.type)
+              this.$set(this.nodeSetting, 'workTypeId', info.meta.workTypeId)
             } else {
               conf.title = '连线'
               if (this.$refs.linkSetting) this.$refs.linkSetting.resetFields()
-              this.$set(this.linkSetting, 'desc', info.meta ? info.meta.desc : '')
+              // this.$set(this.linkSetting, 'desc', info.meta ? info.meta.desc : '')
             }
           },
           cancel: () => {
@@ -175,7 +222,9 @@
         },
         nodeSetting: {
           name: '',
-          desc: ''
+          desc: '',
+          type: 1,
+          workTypeId: ''
         },
         nodeList: [],
         linkList: [],
@@ -187,13 +236,18 @@
               disable (graph) {
                 return !!graph.nodeList.find(node => node.meta.prop === 'start')
               },
-              selected: (graph, coordinate) => {
+              selected: async (graph, coordinate) => {
                 const start = graph.nodeList.find(node => node.meta.prop === 'start')
+                let id = ''
+                await getStepId().then(({ data }) => {
+                  id = data.data.stepId
+                })
                 if (!start) {
                   graph.addNode({
                     width: 90,
                     height: 50,
                     coordinate: coordinate,
+                    id: id,
                     meta: {
                       prop: 'start',
                       name: '开始节点'
@@ -205,11 +259,16 @@
             {
               label: '节点',
               disable: false,
-              selected: (graph, coordinate) => {
+              selected: async (graph, coordinate) => {
+                let id = ''
+                await getStepId().then(({ data }) => {
+                  id = data.data.stepId
+                })
                 graph.addNode({
                   width: 120,
                   height: 70,
                   coordinate: coordinate,
+                  id: id,
                   meta: {
                     prop: 'condition',
                     name: '节点名称'
@@ -222,11 +281,16 @@
               disable (graph) {
                 return !!graph.nodeList.find(point => point.meta.prop === 'end')
               },
-              selected: (graph, coordinate) => {
+              selected: async (graph, coordinate) => {
+                let id = ''
+                await getStepId().then(({ data }) => {
+                  id = data.data.stepId
+                })
                 graph.addNode({
                   width: 90,
                   height: 50,
                   coordinate: coordinate,
+                  id: id,
                   meta: {
                     prop: 'end',
                     name: '结束节点'
@@ -241,6 +305,7 @@
               selected: (graph, coordinate) => {
                 graph.selectAll()
                 this.datas = graph
+              console.log(graph)
               }
             }
           ]
@@ -276,14 +341,14 @@
               }
             }
           ],
-          [
-            {
-              label: '编辑',
-              selected: (link, coordinate) => {
-                this.drawerConf.open(drawerType.link, link)
-              }
-            }
-          ]
+          // [
+          //   {
+          //     label: '编辑',
+          //     selected: (link, coordinate) => {
+          //       this.drawerConf.open(drawerType.link, link)
+          //     }
+          //   }
+          // ]
         ],
         visible: false,
         display: false,
@@ -305,11 +370,21 @@
           techName: [{ required: true, message: '工艺名称不能为空', trigger: 'blur' }],
           techVersion: [{ required: true, message: '工艺版本不能为空', trigger: 'blur' }],
           productId: [{ required: true, message: '产品不能为空', trigger: 'change' }]
+        },
+        dataRule1: {
+          name: [{ required: true, message: '节点名称不能为空', trigger: 'blur' }],
+          type: [{ required: true, message: '节点类型不能为空', trigger: 'change' }],
+          workTypeId: [{ required: true, message: '工种不能为空', trigger: 'change' }]
         }
       }
     },
+    created () {
+      this.getWorkType()
+    },
     methods: {
       async init (id, display) {
+        this.nodeList = []
+        this.linkList = []
         this.dataForm = {
           techName: '',
           techVersion: '',
@@ -324,22 +399,63 @@
           }
         })
         if (!id) return
-        await getInfo(this.id).then(({data}) => {
+        await getInfo(id).then(async ({data}) => {
           if (data && data.code === '200') {
             this.dataForm = data.data
             // 图纸
-            if (data.data.attachList) {
-              data.data.attachList.forEach((item) => {
-                this.fileList.push({
-                  name: item.fileName,
-                  url: item.url,
-                  id: item.url
+            if (data.data.proTechnologyStepLists) {
+              const dataline = []
+              const datanode = []
+              await data.data.proTechnologyStepLists.forEach((v,i) => {
+                const sortNo = []
+                const datas = v.sort((a,b) => Number(a['sortNo']) - Number(b['sortNo']))
+                datas.forEach((item, index) => {
+                  const find = datanode.find(map => map.id == item.stepId)
+                  if (!find) {
+                    datanode.push({
+                      id: item.stepId,
+                      width: (index === 0 || item.workTypeId === '0') ? 90 : 120,
+                      height: (index === 0 || item.workTypeId === '0') ? 50 : 70,
+                      coordinate: item.coordinate.split(','),
+                      meta: {
+                        name: item.stepName,
+                        notes: item.notes || '',
+                        workTypeId: item.workTypeId || '',
+                        type: item.type || ''
+                      }
+                    })
+                  }
+                  const id = item.stepId
+                  if ((index + 1) < datas.length) {
+                    if (datas[index + 1])
+                    dataline.push({
+                      id: uuid('link') ,
+                      startId: id,
+                      endId: datas[index + 1].stepId,
+                      meta: '',
+                      startAt: [(index === 0 || item.workTypeId === '0') ? 90 : 120, (index === 0 || item.workTypeId === '0') ? 25 : 35],
+                      endAt: [0, (index === 0 || item.workTypeId === '0') ? 25 : 35],
+                    })
+                  }
                 })
               })
+              this.$nextTick(() => {
+                setTimeout(() => {
+                  this.nodeList = datanode
+                  this.linkList = dataline
+                }, 200)
+              })
             }
           }
         })
       },
+      getWorkType () {
+        getWorkType().then(({data}) => {
+          if (data && data.code === '200') {
+            this.optionsType1 = data.data
+          }
+        })
+      },
       handleRemove (file, fileList) {
         this.fileList = fileList
       },
@@ -352,21 +468,105 @@
       validateField (type) {
         this.$refs.dataForm.validateField(type)
       },
+      getLineData (dataAll, dList, lList, id, sortNo) {
+        const _l = []
+        lList.forEach(l => {
+          if (l.start.id === id) {
+            _l.push(l.end.id)
+          }
+        })
+        if (!sortNo) {
+          const data = dList.filter(v => v.meta.prop === 'start')[0]
+          _l.forEach(item => {
+            dataAll.push([{
+              'notes': data.meta.desc || '',
+              'sortNo': 0,
+              'stepId': data.id,
+              'stepName': data.meta.name,
+              'workTypeId': data.meta.workTypeId || null,
+              'type': data.meta.type || null,
+              'coordinate': data.coordinate.join(',')
+            }])
+          })
+        }
+        dList.forEach(v => {
+          const _i = _l.indexOf(v.id)
+          if (_i > -1) {
+            if (!v.meta.workTypeId &&  v.meta.prop != 'end') {
+              this.$message.error('完善节点工种')
+              return 
+            }
+            if (!sortNo) {
+              dataAll[_i].push({
+                'notes': v.meta.desc || '',
+                'sortNo': (sortNo + 1),
+                'stepId': v.id,
+                'stepName': v.meta.name,
+                'workTypeId': v.meta.workTypeId || null,
+                'type': v.meta.type || null,
+                'coordinate': v.coordinate.join(',')
+              })
+              this.getLineData(dataAll[_i], dList, lList, v.id, (sortNo + 1))
+            } else {
+              let _has = false
+              dataAll.forEach(items => {
+                if (items.stepId == v.id) {
+                  _has = true
+                }
+              })
+              if (!_has) {
+                dataAll.push({
+                  'notes': v.meta.desc || '',
+                  'sortNo': (sortNo + 1),
+                  'stepId': v.id,
+                  'stepName': v.meta.name,
+                  'workTypeId': v.meta.prop === 'end' ? 0 : (v.meta.workTypeId || ''),
+                  'type': v.meta.type || '',
+                  'coordinate': v.coordinate.join(',')
+                })
+              }
+              this.getLineData(dataAll, dList, lList, v.id, (sortNo + 1))
+            }
+          }
+        })
+      },
       // 表单提交
       dataFormSubmit () {
-        if (!this.datas) {
+        if (!this.datas.nodeList) {
           this.$message.error('请先完成流程图！')
           return
         }
+        if (this.datas.nodeList.length <= 2) {
+          this.$message.error('请先完成流程图！')
+          return
+        }
+
         this.$refs['dataForm'].validate((valid) => {
           if (valid) {
             const proTechnologyStepLists = []
+            let has = false
+            let has1 = false
             this.datas.nodeList.forEach(v =>{
-              proTechnologyStepLists.push({
-                notes: v.meta.desc,
-                stepName: v.meta.name
-              })
+              if (v.meta.prop === 'start') {
+                has = true
+                this.getLineData(proTechnologyStepLists, this.datas.nodeList, this.datas.linkList, v.id, 0)
+              }
+              if (v.meta.prop === 'end') {
+                has1 = true
+              }
             })
+            if (!has) {
+              this.$message.error('成流程图没有开始结点！')
+              return
+            }
+            if (!has1) {
+              this.$message.error('成流程图没有结束结点！')
+              return
+            }
+            if (proTechnologyStepLists.length == 0) {
+              this.$message.error('请先完成流程图！')
+              return
+            }
             this.$http({
               url: this.$http.adornUrl(`/biz-service/technology/submit`),
               method: 'post',
@@ -378,8 +578,8 @@
                   type: 'success',
                   duration: 1500,
                   onClose: () => {
-                    this.visible = false
                     this.$emit('refreshDataList')
+                    this.visible = false
                   }
                 })
               } else {
@@ -424,21 +624,25 @@
         return link.meta ? link.meta.desc : ''
       },
       settingSubmit () {
-        const conf = this.drawerConf
-        if (this.drawerConf.type === drawerType.node) {
-          if (!conf.info.meta) conf.info.meta = {}
-          Object.keys(this.nodeSetting).forEach(key => {
-            this.$set(conf.info.meta, key, this.nodeSetting[key])
-          })
-          this.$refs.nodeSetting.resetFields()
-        } else {
-          if (!conf.info.meta) conf.info.meta = {}
-          Object.keys(this.linkSetting).forEach(key => {
-            this.$set(conf.info.meta, key, this.linkSetting[key])
-          })
-          this.$refs.linkSetting.resetFields()
-        }
-        conf.visible = false
+        this.$refs['nodeSetting'].validate((valid) => {
+          if (valid) {
+            const conf = this.drawerConf
+            if (this.drawerConf.type === drawerType.node) {
+              if (!conf.info.meta) conf.info.meta = {}
+              Object.keys(this.nodeSetting).forEach(key => {
+                this.$set(conf.info.meta, key, this.nodeSetting[key])
+              })
+              this.$refs.nodeSetting.resetFields()
+            } else {
+              if (!conf.info.meta) conf.info.meta = {}
+              Object.keys(this.linkSetting).forEach(key => {
+                this.$set(conf.info.meta, key, this.linkSetting[key])
+              })
+              this.$refs.linkSetting.resetFields()
+            }
+            conf.visible = false
+          }
+        })
       }
     }
   }