feature(交付工单): 硬件交付工单创建功能实现（带钉钉审批）

src/views/work/deliver/components/DingTalkFromToVue.vue

@@ -0,0 +1,389 @@
+<template>
+  <div class="">
+    <el-form ref="dingtalkForm" label-position="top" :model="dingtalkForm">
+      <el-row :gutter="20">
+        <div v-for="(item, index) in dingtalkForm.items" :key="index">
+          <el-col v-if="item.componentName !== 'TableField'" :span="colSpan">
+            <el-form-item
+              v-if="item.props.label != '支持人员'"
+              :label="item.props.label"
+              :prop="'items.' + index + '.props.value'"
+              :rules="{
+                required: item.props.required,
+                message: '不能为空',
+                trigger: ['blur', 'change'],
+              }">
+              <!--文本框-->
+              <el-input
+                v-if="item.componentName === 'TextField'"
+                v-model="item.props.value"
+                :disabled="item.props.disabled"
+                :placeholder="item.props.placeholder" />
+              <!--文本域-->
+              <el-input
+                v-else-if="item.componentName === 'TextareaField'"
+                v-model="item.props.value"
+                :disabled="item.props.disabled"
+                :placeholder="item.props.placeholder"
+                :rows="5"
+                show-word-limit
+                type="textarea" />
+              <!--下拉选-->
+              <el-select
+                v-else-if="item.componentName === 'DDSelectField'"
+                v-model="item.props.value"
+                clearable
+                :disabled="item.props.disabled || item.props.label == '工单类型'"
+                :placeholder="item.props.placeholder"
+                style="width: 100%">
+                <el-option
+                  v-for="option in selectDataToJson(item.props.options)"
+                  :key="option.key"
+                  :label="option.value"
+                  :value="option.value" />
+              </el-select>
+              <!--下拉多选-->
+              <el-select
+                v-else-if="item.componentName === 'DDMultiSelectField'"
+                v-model="item.props.value"
+                clearable
+                :disabled="item.props.disabled"
+                multiple
+                :placeholder="item.props.placeholder"
+                style="width: 100%">
+                <el-option
+                  v-for="option in selectDataToJson(item.props.options)"
+                  :key="option.key"
+                  :label="option.value"
+                  :value="option.value" />
+              </el-select>
+              <!--时间选择器-->
+              <el-date-picker
+                v-else-if="item.componentName === 'DDDateField'"
+                v-model="item.props.value"
+                :disabled="item.props.disabled"
+                :placeholder="item.props.placeholder"
+                :type="item.props.label == '支持时间' ? 'datetime' : 'date'"
+                :value-format="item.props.format" />
+              <!--时间范围选择器-->
+              <el-date-picker
+                v-else-if="item.componentName === 'DDDateRangeField'"
+                v-model="item.props.value"
+                :disabled="item.props.disabled"
+                :end-placeholder="item.props.placeholder[1]"
+                :start-placeholder="item.props.placeholder[0]"
+                style="width: 100%"
+                type="daterange"
+                :value-format="item.props.format" />
+
+              <!--文件-->
+              <el-upload
+                v-else-if="item.componentName === 'DDAttachment'"
+                :ref="item.props.id"
+                :action="uploadFileUrl"
+                :limit="1"
+                :on-remove="
+                  (file, fileList) => {
+                    return removeFile(file, fileList, index)
+                  }
+                "
+                :on-success="
+                  (response, file) => {
+                    return setQuotationFile(response, file, index)
+                  }
+                "
+                :show-file-list="typeof item.props.value == 'string'">
+                <el-button size="mini" type="primary">点击上传</el-button>
+              </el-upload>
+
+              <!--选择用户-->
+              <el-input
+                v-else-if="item.componentName === 'InnerContactField'"
+                v-model="item.props.value"
+                :disabled="item.props.disabled"
+                :placeholder="item.props.placeholder"
+                readonly
+                suffix-icon="el-icon-search"
+                @focus="handleSelectUser(index)" />
+            </el-form-item>
+          </el-col>
+
+          <el-col v-if="item.componentName === 'TableField'" :span="24">
+            <el-form-item :label="item.props.label" :prop="item.props.id" :required="item.props.required">
+              <el-button
+                v-show="item.props.actionName"
+                style="float: right; margin-top: -20px; margin-bottom: 10px"
+                @click="addTableData(index)">
+                {{ item.props.actionName }}
+              </el-button>
+              <!--表格-->
+              <el-table :key="dingTableFlag" :ref="'dingTable' + index" border :data="item.tableData" height="250px">
+                <el-table-column
+                  v-for="(child, idx) in item.children"
+                  :key="idx"
+                  align="center"
+                  :label="child.props.label"
+                  :prop="child.props.id"
+                  show-overflow-tooltip>
+                  <template #default="{ row }">
+                    <!--文本框-->
+                    <el-select
+                      v-if="child.props.label === '产品型号'"
+                      v-model="row[child.props.id]"
+                      filterable
+                      :placeholder="item.props.placeholder"
+                      value-key="prodCode"
+                      @change="(val) => selectLabel(val, item.children, row)">
+                      <el-option v-for="prod in productList" :key="prod.id" :label="prod.prodCode" :value="prod" />
+                    </el-select>
+                    <el-select
+                      v-if="child.props.label === '产品名称'"
+                      v-model="row[child.props.id]"
+                      filterable
+                      :placeholder="item.props.placeholder"
+                      value-key="prodName"
+                      @change="(val) => selectLabel(val, item.children, row)">
+                      <el-option v-for="prod in productList" :key="prod.id" :label="prod.prodName" :value="prod" />
+                    </el-select>
+                    <!--数字文本框-->
+                    <el-input
+                      v-if="child.componentName === 'NumberField'"
+                      v-model="row[child.props.id]"
+                      :min="1"
+                      onkeyup="value=value.replace(/[^\d]/g,'')" />
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-col>
+        </div>
+      </el-row>
+    </el-form>
+
+    <!-- 选择人员弹窗 -->
+    <select-user ref="selectUser" @save="selectUser" />
+  </div>
+</template>
+
+<script>
+  import productApi from '@/api/base/product'
+  import workApi from '@/api/work/index'
+  import SelectUser from '@/components/select/SelectUser'
+  import asyncUploadFile from '@/utils/uploadajax'
+  import axios from 'axios'
+  import to from 'await-to-js'
+  export default {
+    name: 'DingTalkFromToVue',
+    components: {
+      SelectUser,
+    },
+    props: {
+      colSpan: {
+        type: Number,
+        default: 24,
+      },
+    },
+    data() {
+      return {
+        dingtalkForm: {},
+        productList: [],
+        dingRules: {},
+        userItemIndex: {},
+        dingTableFlag: true,
+        uploadFileUrl: process.env.VUE_APP_UPLOAD_FILE_WEED,
+        fileSettings: {
+          // 文件配置信息
+          fileSize: 20971520,
+          fileTypes: '.rar,.zip,.doc,.docx,.pdf',
+        },
+      }
+    },
+    mounted() {
+      this.getProduct()
+    },
+    // 方法集合
+    methods: {
+      selectLabel(val, children, row) {
+        const codeId = children.find((item) => item.props.label == '产品型号').props.id
+        const nameId = children.find((item) => item.props.label == '产品名称').props.id
+        row[codeId] = val.prodCode
+        row[nameId] = val.prodName
+      },
+      getProduct() {
+        let params = {
+          pageNum: 1,
+          pageSize: 999,
+          onlyHardware: true,
+        }
+        Promise.all([productApi.getList({ ...params })])
+          .then(([product]) => {
+            this.productList = product.data.list || []
+          })
+          .catch((err) => console.log(err))
+      },
+      addTableData(index) {
+        let newObj = {}
+        let tableData = this.dingtalkForm.items[index].tableData
+        if (!tableData) {
+          this.dingtalkForm.items[index].tableData = []
+        }
+        for (let child of this.dingtalkForm.items[index].children) {
+          newObj[child.props.id] = ''
+        }
+        this.dingtalkForm.items[index].tableData.push(newObj)
+        this.dingTableFlag = !this.dingTableFlag
+      },
+      handleSelectUser(index) {
+        this.userItemIndex = index
+        this.$refs.selectUser.open()
+      },
+      selectUser(val) {
+        let nickName = val.map((item) => item.nickName).join()
+        this.dingtalkForm.items[this.userItemIndex].props.value = nickName
+        this.$forceUpdate()
+      },
+      removeFile(file, list, index) {
+        this.dingtalkForm.items[index].props.value = null
+      },
+      async setQuotationFile(res, file, index) {
+        // 如果上传成功
+        if (res.Code == 200) {
+          console.log(file)
+          const fileName = file.name // 资料存储url
+          const fileUrl = res.Data // 资料存储url
+          const [uploadErr, uploadRes] = await to(workApi.uploadDingtalk({ fileName, fileUrl }))
+          if (uploadErr) return
+          if (uploadRes.code == 200) {
+            this.dingtalkForm.items[index].props.value = uploadRes.data
+            let temp = JSON.parse(JSON.stringify(this.dingtalkForm))
+            this.$refs.dingtalkForm.clearValidate('items.' + index + '.props.value')
+            this.dingtalkForm = temp
+          }
+        } else {
+          this.$message.error('上传文件失败')
+        }
+      },
+      // 文件
+      setFile(index, file) {
+        // this.$emit('upload', file.raw)
+        let flag1 = file.size < this.fileSettings.fileSize
+        if (!flag1) {
+          this.$message.warning('文件过大，请重新选择！')
+          this.dingtalkForm.items[index].props.value = ''
+          return false
+        }
+        // let flag2 = this.fileSettings.fileTypes.split(',').includes('.' + file.name.split('.').pop())
+        // if (!flag2) {
+        //   this.$message.warning('文件类型不符合，请重新选择！')
+        //   this.dingtalkForm.items[index].props.value = ''
+        //   this.$forceUpdate()
+        //   return false
+        // }
+        return true
+        // // 上传文件一直校验不过问题方案
+        // let temp = JSON.parse(JSON.stringify(this.dingtalkForm))
+        // this.$refs.dingtalkForm.clearValidate('items.' + index + '.props.value')
+        // this.dingtalkForm = temp
+      },
+      // 上传
+      uploadrequest(index, option) {
+        let idx = index
+        console.log(option)
+        let _this = this
+        let url = process.env.VUE_APP_UPLOAD_WEED
+        axios
+          .post(url)
+          .then(function (res) {
+            if (res.data && res.data.fid && res.data.fid !== '') {
+              option.action = `${process.env.VUE_APP_PROTOCOL}${res.data.publicUrl}/${res.data.fid}`
+              asyncUploadFile(option).then(async (res) => {
+                if (res) {
+                  let fileRes = JSON.parse(res)
+                  const fileName = fileRes.name // 资料存储url
+                  const fileUrl = option.action // 资料存储url
+                  const [uploadErr, uploadRes] = await to(workApi.uploadDingtalk({ fileName, fileUrl }))
+                  if (uploadErr) return
+                  if (uploadRes.code == 200) {
+                    console.log(uploadRes)
+                    _this.dingtalkForm.items[idx].props.value = uploadRes.data
+                    let temp = JSON.parse(JSON.stringify(_this.dingtalkForm))
+                    _this.$refs.dingtalkForm.clearValidate('items.' + idx + '.props.value')
+                    _this.dingtalkForm = temp
+                  }
+                }
+              })
+            } else {
+              _this.$message({
+                type: 'warning',
+                message: '未上传成功！请刷新界面重新上传！',
+              })
+            }
+          })
+          .catch(function () {
+            _this.$message({
+              type: 'warning',
+              message: '未上传成功！请重新上传！',
+            })
+          })
+      },
+      selectDataToJson(data) {
+        return data.map((item) => {
+          return JSON.parse(item)
+        })
+      },
+      setFormAndRules(dingtalkForm) {
+        for (let index in dingtalkForm.items) {
+          if (dingtalkForm.items[index].componentName === 'DDDateRangeField') {
+            dingtalkForm.items[index].props.placeholder = JSON.parse(dingtalkForm.items[index].props.label)
+            dingtalkForm.items[index].props.label = dingtalkForm.items[index].props.placeholder.join(' - ')
+          }
+          // console.log(dingtalkForm.items[index].props.label, dingtalkForm.items[index].componentName,"=================")
+          if (dingtalkForm.items[index].props.label == '工单类型') {
+            console.log(dingtalkForm.items[index].props.options)
+            dingtalkForm.items[index].props.value = JSON.parse(dingtalkForm.items[index].props.options[0]).value
+          }
+        }
+        this.dingtalkForm = dingtalkForm
+      },
+      getFormData() {
+        for (let index in this.dingtalkForm.items) {
+          // 表格数据需要特殊处理
+          if (this.dingtalkForm.items[index].componentName === 'TableField') {
+            this.dingtalkForm.items[index].props.value = []
+            let tableData = this.dingtalkForm.items[index].tableData || []
+            for (let row of tableData) {
+              // 循环数据，组装信息
+              let newData = []
+              for (let colKey in row) {
+                let child = this.dingtalkForm.items[index].children.find((val) => {
+                  return val.props.id === colKey //筛选出匹配数据
+                })
+                newData.push({
+                  value: row[colKey],
+                  id: child.props.id,
+                  name: child.props.label,
+                  required: child.props.required,
+                  componentName: child.componentName,
+                })
+              }
+              this.dingtalkForm.items[index].props.value.push(newData)
+            }
+          }
+        }
+        return this.dingtalkForm
+      },
+      validateForm() {
+        let result = false
+        this.$refs['dingtalkForm'].validate((valid) => {
+          result = valid
+        })
+        return result
+      },
+      resetForm() {
+        this.$refs['dingtalkForm'].resetFields()
+      },
+    },
+  }
+</script>
+
+<style lang="scss" scoped></style>

src/views/work/deliver/components/Edit.vue

@@ -0,0 +1,307 @@
+<template>
+  <el-dialog append-to-body :title="title" :visible.sync="dialogFormVisible" @close="close">
+    <el-form ref="form" label-position="top" label-width="100px" :model="form" :rules="rules">
+      <el-row :gutter="20">
+        <!-- <el-col :span="12">
+          <el-form-item label="工单名称" prop="name">
+            <el-input v-model="form.name" />
+          </el-form-item>
+        </el-col> -->
+        <el-col :span="12">
+          <el-form-item label="项目" prop="nboId">
+            <el-select v-model="form.nboId" filterable placeholder="项目" style="width: 100%" @change="changeBusiness">
+              <el-option v-for="item in businessList" :key="item.id" :label="item.nboName" :value="item.id" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="合同" prop="contractId">
+            <el-select
+              v-model="form.contractId"
+              filterable
+              placeholder="合同"
+              style="width: 100%"
+              @change="changeContract">
+              <el-option v-for="item in contractList" :key="item.id" :label="item.contractName" :value="item.id" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <!-- <el-col :span="12">
+          <el-form-item label="备注" prop="remark">
+            <el-input v-model="form.remark" placeholder="请输入内容" :rows="2" show-word-limit type="textarea" />
+          </el-form-item>
+        </el-col> -->
+        <!-- <el-col :span="12">
+          <el-form-item label="结束时间" prop="remark">
+            <el-date-picker
+              v-model="form.endTime"
+              placeholder="选择结束时间"
+              style="width: 100%"
+              type="datetime"
+              value-format="yyyy-MM-dd HH:mm:ss" />
+          </el-form-item>
+        </el-col> -->
+      </el-row>
+
+      <!--      钉钉审批流表单-->
+      <DingTalkFromToVue ref="dingTalkFrom" :col-span="12" />
+      <!--      钉钉审批流表单-->
+      <!--      <el-row :gutter="20">-->
+
+      <!--      </el-row>-->
+    </el-form>
+    <template #footer>
+      <el-button @click="close">取 消</el-button>
+      <el-button v-if="!form.id" type="primary" @click="save">确 定</el-button>
+    </template>
+
+    <!-- 选择支持人员弹窗 -->
+    <select-user ref="selectUser" @save="selectUser" />
+  </el-dialog>
+</template>
+
+<script>
+  import typeApi from '@/api/work/type'
+  import SelectUser from '@/components/select/SelectUser'
+  import DingTalkFromToVue from './DingTalkFromToVue.vue'
+  import businessApi from '@/api/proj/business'
+  import contractApi from '@/api/contract'
+  import deliverApi from '@/api/work/deliver'
+
+  export default {
+    name: 'WorkOrderEdit',
+    components: {
+      SelectUser,
+      DingTalkFromToVue,
+    },
+    props: {
+      businessInfo: {
+        type: Object,
+        default: () => {},
+      },
+    },
+    data() {
+      return {
+        form: {
+          nboId: undefined,
+          nboName: undefined,
+          nboCode: undefined,
+          custId: undefined,
+          custName: undefined,
+          name: undefined,
+          orderTypeId: undefined,
+          orderTypeName: undefined,
+          assignUserId: undefined,
+          assignUserName: undefined,
+          formData: undefined,
+          dingTalkFormData: undefined,
+          feedback: undefined,
+          // file: undefined,
+          remark: undefined,
+          endTime: undefined,
+          dingtalkForm: undefined,
+          trialTimeStart: undefined,
+          trialTimeEnd: undefined,
+          expectTime: undefined,
+          supportTime: undefined,
+          contractId: '',
+          contractName: '',
+        },
+        rules: {
+          nboId: [{ required: true, message: '不能为空', trigger: ['blur', 'change'] }],
+          contractId: [{ required: true, message: '不能为空', trigger: ['blur', 'change'] }],
+        },
+        title: '',
+        dialogFormVisible: false,
+        orderTypeList: [],
+        dingtalkForm: undefined,
+        businessList: [],
+        contractList: [],
+      }
+    },
+    mounted() {
+      this.getOrderTypeList()
+    },
+    methods: {
+      async getOrderTypeList() {
+        const { data } = await typeApi.getList()
+        this.orderTypeList = data.list
+      },
+      async getBusinessList() {
+        this.businessList = []
+        const { data } = await businessApi.getList({ pageNum: 1, pageSize: 99999 })
+        const { list } = data
+        this.businessList = list
+      },
+      changeBusiness() {
+        this.form.contractId = ''
+        this.form.contractName = ''
+        for (let business of this.businessList) {
+          if (business.id == this.form.nboId) {
+            this.form.nboName = business.nboName
+            this.form.nboCode = business.nboCode
+            this.form.custId = business.custId
+            this.form.custName = business.custName
+            this.form.saleId = business.saleId
+            this.form.saleName = business.saleName
+            break
+          }
+        }
+        this.getContractList()
+      },
+      async getContractList() {
+        this.contractList = []
+        const { data } = await contractApi.getList({ nboId: this.form.nboId, pageNum: 1, pageSize: 99999 })
+        const { list } = data
+        this.contractList = list
+      },
+      changeContract() {
+        for (let contract of this.contractList) {
+          if (contract.id == this.form.contractId) {
+            this.form.contractName = contract.contractName
+            break
+          }
+        }
+        this.changeOrderType()
+      },
+      changeOrderType() {
+        let item = this.orderTypeList.find((item) => {
+          return item.name === '硬件交付工单'
+        })
+        this.form.orderTypeName = item.name
+        this.form.orderTypeCode = item.workflowCode
+        this.dingtalkForm = JSON.parse(item.formColumn)
+        for (let index in this.dingtalkForm.items) {
+          if (this.dingtalkForm.items[index].props.label === '项目编码') {
+            this.dingtalkForm.items[index].props.value = this.form.nboCode
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+          if (this.dingtalkForm.items[index].props.label === '项目名称') {
+            this.dingtalkForm.items[index].props.value = this.form.nboName
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+          if (this.dingtalkForm.items[index].props.label === '客户名称') {
+            this.dingtalkForm.items[index].props.value = this.form.custName
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+          if (this.dingtalkForm.items[index].props.label === '所在省') {
+            this.dingtalkForm.items[index].props.value = this.form.custProvince
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+          if (this.dingtalkForm.items[index].props.label === '所在市') {
+            this.dingtalkForm.items[index].props.value = this.form.custCity
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+          if (this.dingtalkForm.items[index].props.label === '销售工程师') {
+            this.dingtalkForm.items[index].props.value = this.form.saleName
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+          if (this.dingtalkForm.items[index].props.label === '工单名称') {
+            this.dingtalkForm.items[index].props.value = this.form.custName + this.form.orderTypeName
+          }
+          if (this.dingtalkForm.items[index].props.label === '合同名称') {
+            this.dingtalkForm.items[index].props.value = this.form.contractName
+            this.dingtalkForm.items[index].props.disabled = true
+          }
+        }
+        this.$refs.dingTalkFrom.setFormAndRules(this.dingtalkForm)
+      },
+      // handleUploadFile(file) {
+      //   this.form.file = file
+      // },
+      handleSelectUser() {
+        this.$refs.selectUser.open()
+      },
+      selectUser(val) {
+        if (val && val.length > 0) {
+          this.form.assignUserId = val[0].id
+          this.form.assignUserName = val.map((item) => item.nickName).join()
+        }
+      },
+      showEdit(row) {
+        this.getBusinessList()
+        if (!row) {
+          this.title = '添加'
+          this.businessList = []
+          this.contractList = []
+        } else {
+          this.title = '编辑'
+          this.form = Object.assign({}, row)
+        }
+        this.dialogFormVisible = true
+      },
+      close() {
+        this.$refs['dingTalkFrom'].resetForm()
+        this.$refs['form'].resetFields()
+        this.form = this.$options.data().form
+        if (this.dingtalkForm.items) {
+          this.dingtalkForm.items.splice(0, this.dingtalkForm.items.length)
+        }
+        this.dialogFormVisible = false
+      },
+      save() {
+        let dingValid = this.$refs['dingTalkFrom'].validateForm()
+        this.$refs['form'].validate(async (valid) => {
+          if (valid && dingValid) {
+            let items = []
+            let dingtalkForm = this.$refs['dingTalkFrom'].getFormData()
+            for (let item of dingtalkForm.items) {
+              if (item.componentName === 'DDAttachment') {
+                if (!item.props && item.props.required) {
+                  this.$baseMessage('请上传' + item.props.label, 'error', 'vab-hey-message-error')
+                  return
+                }
+              }
+              if (item.props.label === '项目编码') {
+                this.form.nboCode = item.props.value
+              }
+              if (item.props.label === '项目名称') {
+                this.form.nboName = item.props.value
+              }
+              if (item.props.label === '客户名称') {
+                this.form.custName = item.props.value
+              }
+              if (item.props.label === '工单名称') {
+                this.form.name = item.props.value
+              }
+              if (item.props.label === '备注' && !item.props.value) {
+                item.props.value = ''
+              }
+              if (item.props.label === '调研表上传' && !item.props.value) {
+                item.props.value = ''
+              }
+
+              if (item.props.label === '试用开始时间') {
+                this.form.trialTimeStart = item.props.value
+              }
+              if (item.props.label === '试用结束时间') {
+                this.form.trialTimeEnd = item.props.value
+              }
+              if (item.props.label === '期望完成时间') {
+                this.form.expectTime = item.props.value
+              }
+              if (item.props.label === '支持时间') {
+                this.form.supportTime = item.props.value
+              }
+              if (item.props.label === '支持人员') {
+                item.props.value = this.form.assignUserName
+              }
+              items.push({
+                componentName: item.componentName,
+                id: item.props.id,
+                name: item.props.label,
+                value: item.props.value,
+                required: item.props.required,
+              })
+            }
+            this.form.formData = items
+            const { msg } = await deliverApi.addDeliverOrder(this.form)
+            this.$baseMessage(msg, 'success', 'vab-hey-message-success')
+            this.$emit('fetch-data')
+            this.close()
+          }
+        })
+      },
+    },
+  }
+</script>

src/views/work/deliver/index.vue

@@ -30,7 +30,11 @@
           </el-form-item>
         </el-form>
       </vab-query-form-top-panel>
-      <vab-query-form-left-panel :span="12" />
+      <vab-query-form-left-panel :span="12">
+        <el-button v-permissions="['work:deliverOrder:create']" icon="el-icon-plus" type="primary" @click="createOrder">
+          创建工单
+        </el-button>
+      </vab-query-form-left-panel>
       <vab-query-form-right-panel :span="12">
         <table-tool :columns="columns" :show-columns.sync="showColumns" table-type="deliverWorkOrderTable" />
       </vab-query-form-right-panel>
@@ -84,7 +88,9 @@
           <el-button v-if="row.orderType != '20' && !row.deliverManName" type="text" @click="handleUpdateUser(row)">
             成员
           </el-button>
-          <el-button v-if="row.orderStatus != 20" type="text" @click="handleFinish(row)">完成</el-button>
+          <el-button v-if="row.orderStatus == 10 || row.orderStatus == 15" type="text" @click="handleFinish(row)">
+            完成
+          </el-button>
         </template>
       </el-table-column>
       <template #empty>
@@ -108,6 +114,8 @@
     <update-user ref="updateUser" @fetch-data="restFetchData" />
     <!-- 交付工单启动 -->
     <start ref="startOrder" @fetch-data="restFetchData" />
+    <!-- 创建工单 -->
+    <order-edit ref="order-edit" @fetch-data="restFetchData" />
   </div>
 </template>
 
@@ -119,10 +127,11 @@
   import start from './components/start'
   import UpdateUser from './components/updateUser'
   import { mapGetters } from 'vuex'
+  import orderEdit from '@/views/work/deliver/components/Edit'
 
   export default {
     name: 'WorkOrder',
-    components: { TableTool, Finish, start, UpdateUser },
+    components: { TableTool, Finish, start, UpdateUser, orderEdit },
     data() {
       return {
         activeName: 'first',
@@ -241,6 +250,10 @@
     },
 
     methods: {
+      // 创建工单
+      createOrder() {
+        this.$refs['order-edit'].showEdit()
+      },
       getOptions() {
         Promise.all([this.getDicts('delivery_status'), this.getDicts('sys_product_line')])
           .then(([deliveryStatus, productLine]) => {