问题申报页面

applications/dee-mes/src/views/taskExecution/components/ProblemDeclare/index.vue

+<template>
+  <section class="ProblemDeclare">
+    <dee-dialog
+      id="dee-dialog"
+      title="问题申报"
+      :dialog-visible.sync="visible"
+      width="90%"
+      custom-class="mobile-dialog"
+      :before-close="handleClose"
+    >
+      <el-form
+        ref="form"
+        class="AlodinDeploysCard-form"
+        :model="form"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-row style="margin-bottom: 10px">
+          <el-col :span="8" :xs="12">
+            <el-form-item label="AO号">
+              <el-input v-model="form.aoNo" clearable disabled placeholder="自动带入" class="input-with-select el-input--small" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" :xs="12">
+            <el-form-item label="AO名称">
+              <el-input v-model="form.aoName" clearable disabled placeholder="自动带入" class="input-with-select el-input--small" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" :xs="12">
+            <el-form-item label="站位">
+              <el-input
+                v-model="form.standPosition"
+                clearable
+                disabled
+                placeholder="自动带入"
+                class="input-with-select el-input--small"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row style="margin-bottom: 10px">
+          <el-col :span="8" :xs="12">
+            <el-form-item label="机型">
+              <el-input
+                v-model="form.airModel"
+                clearable
+                disabled
+                placeholder="自动带入"
+                class="input-with-select el-input--small"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" :xs="12">
+            <el-form-item label="架次">
+              <el-input
+                v-model="form.sorties"
+                clearable
+                disabled
+                placeholder="自动带入"
+                class="input-with-select el-input--small"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" :xs="12">
+            <el-form-item label="工序号">
+              <el-input v-model="form.opNo" disabled placeholder="自动带入" class="input-with-select el-input--small" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-col :span="8" :xs="12">
+            <el-form-item label="问题类型" prop="sptype">
+              <el-select v-model="form.sptype" clearable placeholder="请选择问题类型" class="input-with-select el-input--small">
+                <el-option
+                  v-for="item in questionClass"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" :xs="12">
+            <el-form-item label="是否加工暂停" prop="tfpause">
+              <el-radio-group v-model="form.tfpause">
+                <el-radio :label="true">是</el-radio>
+                <el-radio :label="false">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-form-item label="问题附件">
+            <div class="img-box">
+              <div v-for="(item,i) in imgUrlList" v-show="imgUrlList.length>0" :key="i" class="img-item">
+                <img v-if="item.url" :src="item.url" alt="">
+                <span v-else>{{ item.name }}</span>
+                <i class="el-icon-circle-close" @click="deleteImg(i)" />
+              </div>
+
+              <div v-show="imgUrlList.length < 9" id="alert-box-item">
+                <span @click="toGetImg">+</span>
+              </div>
+            </div>
+            <!-- <input id="file" type="file" accept="image/*;capture=camera"> -->
+
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <el-form-item label="问题描述" prop="description">
+            <el-input
+              v-model="form.description"
+              clearable
+              type="textarea"
+              class="textarea"
+              :rows="4"
+              resize
+              placeholder="请输入描述内容"
+            />
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <el-form-item label="站位长/站位计划员/站位工程师" prop="receiver" label-width="250px">
+            <!-- <DxUserSelect /> -->
+            <GeneralUserSelect v-model="form.receiver" :item="{multiple:true}" />
+          </el-form-item>
+        </el-row>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button
+          type="primary"
+          :disabled="disabled"
+          @click="save"
+        >确 定</el-button>
+        <el-button
+          :disabled="disabled"
+          @click="visible = false"
+        >取 消</el-button>
+      </span>
+    </dee-dialog>
+  </section>
+</template>
+<script>
+// import test from './test.vue'
+let inputElement = null
+// import axios from 'axios'
+// import { downloadPdfHandle } from '@/api/inventory.js'
+import { post } from '@/utils/http'
+export default {
+  components: {
+    // test
+  },
+
+  data() {
+    return {
+      visible: false,
+      disabled: false,
+      valueUrl: '',
+      form: {
+        airModel: '',
+        sorties: '',
+        standPosition: '',
+        aoNo: '',
+        aoName: '',
+        opNo: '',
+        sptype: '', // 问题类型
+        description: '', // 问题描述
+        tfpause: '',
+        receiver: []
+      },
+      questionClass: [
+        { label: '工艺', value: '工艺' },
+        { label: '设计', value: '设计' },
+        { label: '质量', value: '质量' },
+        { label: '物料', value: '物料' },
+        { label: '设备', value: '设备' },
+        { label: '工装', value: '工装' },
+        { label: '工具', value: '工具' },
+        { label: '安全', value: '安全' },
+        { label: '其他', value: '其他' }
+      ],
+      rules: {
+        sptype: [
+          { required: true, message: '请选择问题类型', trigger: 'change' }
+        ],
+        receiver: [
+          { required: true, message: '请选择站位长/站位计划员/站位工程师', trigger: 'change' }
+        ]
+      },
+      aoid: '',
+      procedureId: '',
+      wordId: '',
+      imgFilesList: [],
+      imgUrlList: [],
+      userList: [],
+      loading: false
+    }
+  },
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    toGetImg() {
+      if (inputElement === null) {
+        // 生成文件上传的控件
+        inputElement = document.createElement('input')
+        inputElement.setAttribute('type', 'file')
+        inputElement.setAttribute('multiple', 'multiple')
+        inputElement.setAttribute('accept', 'image/*;capture=camera')
+        inputElement.style.display = 'none'
+        if (window.addEventListener) {
+          inputElement.addEventListener('change', this.uploadFile, false)
+        } else {
+          inputElement.attachEvent('onchange', this.uploadFile)
+        }
+        document.body.appendChild(inputElement)
+      }
+      inputElement.click()
+    },
+    uploadFile(el) {
+      if (el && el.target && el.target.files && el.target.files.length > 0) {
+        const files = el.target.files[0]
+        const isLt2M = files.size
+        // const size = files.size / 1024 / 1024
+        // 判断上传文件的大小
+        if (!isLt2M) {
+          this.$message.error('上传头像图片大小不能超过 2MB!')
+        } else if (files.type.indexOf('image') === -1) {
+          // 如果不是图片格式
+          // this.$dialog.toast({ mes: '请选择图片文件' })
+          // this.$message.error('请选择图片文件')
+          const that = this
+          const reader = new FileReader()// 创建读取文件对象
+          reader.readAsDataURL(el.target.files[0]) // 发起异步请求，读取文件
+          reader.onload = function() {
+            const params = new FormData() // 创建一个form对象
+            params.append('file', el.target.files[0])
+            params.append('domainName', 'tongfei')
+            // 文件读取完成后
+            // 读取完成后，将结果赋值给img的src
+            that.imgFilesList.push(params)
+            that.imgUrlList.push({ name: el.target.files[0].name })
+          }
+        } else {
+          const that = this
+          const reader = new FileReader()// 创建读取文件对象
+          reader.readAsDataURL(el.target.files[0]) // 发起异步请求，读取文件
+          reader.onload = function() {
+            const params = new FormData() // 创建一个form对象
+            params.append('file', el.target.files[0])
+            params.append('domainName', 'tongfei')
+            // 文件读取完成后
+            // 读取完成后，将结果赋值给img的src
+            that.imgFilesList.push(params)
+            that.imgUrlList.push({ url: this.result })
+          }
+        }
+      }
+    },
+    deleteImg(index) {
+      this.$delete(this.imgUrlList, index)
+      this.$delete(this.imgFilesList, index)
+    },
+    uploadImg() {
+      return new Promise((resolve, reject) => {
+        const result = []
+        // this.imgFilesList.forEach((item, i) => {
+        //   const baseURl = downloadPdfHandle()
+        //   result[i] = new Promise((resolve, reject) => {
+        //     axios({
+        //       method: 'post',
+        //       url: baseURl + `/dfs/fileManager/upload`,
+        //       transformRequest: [
+        //         function() {
+        //           return item
+        //         }
+        //       ],
+        //       headers: {
+        //         token: `${localStorage.getItem('token')}`,
+        //         'Content-Type': 'multipart/form-data;charse=UTF-8',
+        //         'equipment_id': `${localStorage.getItem('uid')}`
+        //       }
+        //     })
+        //       .then((res) => {
+        //         resolve(res.data.items.fileId)
+        //       })
+        //       .catch((err) => {
+        //         reject(err)
+        //       })
+        //       .finally(() => {})
+        //   })
+        // })
+        Promise.all(result).then(res => {
+          resolve(res)
+        }).catch((err) => {
+          reject(err)
+        })
+          .finally(() => {})
+      })
+    },
+    // 打开弹出框s
+    open() {
+      this.visible = true
+      this.imgUrlList = []
+      this.imgFilesList = []
+      this.$refs['form'] && this.$refs['form'].resetFields()
+      this.$nextTick(() => {
+        this.form = {
+          aoName: this.$parent.headerData.name,
+          aoNo: this.$parent.headerData.serialNumber,
+          opNo: this.$parent.editor.serialNumber,
+          airModel: this.$parent.headerData.resName,
+          sorties: this.$parent.headerData.serialNo,
+          standPosition: this.$parent.headerData.positionNumber
+
+        }
+        this.aoid = this.$parent.headerData.aoId
+        // 工序工步id
+        this.procedureId = this.$parent.editor.tableId
+        // 作业计划id
+        this.wordId = this.$parent.headerData.id
+      })
+    },
+    /**
+     * 保存功能
+     * 根据是否有id处理创建和编辑逻辑
+     */
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          this.$utils.showMessageWarning('请完整填写表单')
+          return false
+        }
+        this.disabled = true
+        this.uploadImg().then(res => {
+          var result = []
+          res.forEach(item => {
+            result.push({ targetId: item })
+          })
+          var receiver = ''
+          this.form.receiver.forEach((item, i) => {
+            receiver += (item + (this.form.receiver.length - 1 > i ? ',' : ''))
+          })
+          console.log(receiver)
+          const params = {
+            operator: 'ADD',
+            subTypeName: 'SpotProblem',
+            opId: this.procedureId, // 工序工步id
+            opIdType: 'ExtProcessOperation',
+            sptype: this.form.sptype,
+            description: this.form.description,
+            aoPlanId: this.wordId,
+            aoPlanIdType: 'JoExecutePlan',
+            tfpause: this.form.tfpause,
+            opNo: this.form.opNo,
+            aoNo: this.form.aoNo,
+            aoName: this.form.aoName,
+            airModel: this.form.airModel,
+            sorties: this.form.sorties,
+            standPosition: this.form.standPosition,
+            receiver: receiver
+            // 'objFileLinks': result,
+
+          }
+          post('/SpotProblem/recursion', params)
+            .then((res) => {
+              this.$parent.getWorkingProcedure()
+              this.reset('申报')
+            })
+            .catch((err) => {
+              console.log(err)
+            })
+            .finally(() => {
+              this.disabled = false
+            })
+        }).catch((err) => {
+          console.log(err)
+        })
+      })
+    },
+    // 重置弹出框
+    reset(message) {
+      this.visible = false
+      this.$message({
+        message: `${message}成功`,
+        type: 'success'
+      })
+      this.$emit('reload')
+    },
+    // 取消
+    handleClose() {
+      // this.$refs.form.reset()
+      this.visible = false
+      // this.$refs['form'].resetFields()
+    }
+  }
+}
+</script>
+<style lang="scss">
+.ProblemDeclare {
+  .el-form {
+    .el-textarea {
+      height: 100px;
+    }
+    /deep/.el-textarea__inner {
+      height: 100px !important;
+    }
+  }
+
+}
+.img-box{
+      display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    .img-item{
+          margin-right: 10px;
+    width: 100px;
+    position: relative;
+    >img{
+      width: 100%;
+      height: 100%;
+    }
+    .el-icon-circle-close{
+      position: absolute;
+      top: 10px;
+      right: 10px;
+      color: red;
+      cursor: pointer;
+      z-index: 999;
+    }
+    }
+}
+ #alert-box-item {
+    overflow: hidden;
+    width: 50px;
+    height: auto;
+    display: flex;
+    align-items: center;
+    >span{
+      display: block;
+       width: 50px;
+    height: 50px;
+   border:1px solid #dcdfe6;
+    text-align: center;
+    font-size: 50px;
+    cursor: pointer;
+    }
+ }
+</style>

applications/dee-mes/src/views/taskExecution/components/ProblemDeclare/test.vue

+<template>
+
+  <div class="camera_outer">
+    <video id="videoCamera" :width="videoWidth" :height="videoHeight" autoplay />
+
+    <canvas id="canvasCamera" style="display:none;" :width="videoWidth" :height="videoHeight" />
+
+    <div v-if="imgSrc" class="img_bg_camera">
+
+      <img :src="imgSrc" alt="" class="tx_img">
+
+    </div>
+
+    <button @click="getCompetence()">打开摄像头</button>
+
+    <button @click="stopNavigator()">关闭摄像头</button>
+
+    <button @click="setImage()">拍照</button>
+
+  </div>
+
+</template>
+
+<script>
+
+export default {
+
+  data() {
+    return {
+
+      videoWidth: 3000,
+
+      videoHeight: 300,
+
+      imgSrc: '',
+
+      thisCancas: null,
+
+      thisContext: null,
+
+      thisVideo: null
+
+    }
+  },
+
+  methods: {
+    change(e) {
+      console.log(e)
+    },
+    // 调用权限（打开摄像头功能）
+
+    getCompetence() {
+      var _this = this
+
+      this.thisCancas = document.getElementById('canvasCamera')
+
+      this.thisContext = this.thisCancas.getContext('2d')
+
+      this.thisVideo = document.getElementById('videoCamera')
+
+      // 旧版本浏览器可能根本不支持mediaDevices，我们首先设置一个空对象
+
+      if (navigator.mediaDevices === undefined) {
+        navigator.mediaDevices = {}
+      }
+
+      // 一些浏览器实现了部分mediaDevices，我们不能只分配一个对象
+
+      // 使用getUserMedia，因为它会覆盖现有的属性。
+
+      // 这里，如果缺少getUserMedia属性，就添加它。
+
+      if (navigator.mediaDevices.getUserMedia === undefined) {
+        navigator.mediaDevices.getUserMedia = function(constraints) {
+          // 首先获取现存的getUserMedia(如果存在)
+
+          var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.getUserMedia
+
+          // 有些浏览器不支持，会返回错误信息
+
+          // 保持接口一致
+
+          if (!getUserMedia) {
+            return Promise.reject(new Error('getUserMedia is not implemented in this browser'))
+          }
+
+          // 否则，使用Promise将调用包装到旧的navigator.getUserMedia
+
+          return new Promise(function(resolve, reject) {
+            getUserMedia.call(navigator, constraints, resolve, reject)
+          })
+        }
+      }
+
+      var constraints = { audio: false, video: { width: this.videoWidth, height: this.videoHeight, transform: 'scaleX(-1)' }}
+
+      navigator.mediaDevices.getUserMedia(constraints).then(function(stream) {
+        // 旧的浏览器可能没有srcObject
+
+        if ('srcObject' in _this.thisVideo) {
+          _this.thisVideo.srcObject = stream
+        } else {
+          // 避免在新的浏览器中使用它，因为它正在被弃用。
+
+          _this.thisVideo.src = window.URL.createObjectURL(stream)
+        }
+
+        _this.thisVideo.onloadedmetadata = function(e) {
+          _this.thisVideo.play()
+        }
+      }).catch(err => {
+        console.log(err)
+      })
+    },
+
+    // 绘制图片（拍照功能）
+
+    setImage() {
+      var _this = this
+
+      // 点击，canvas画图
+
+      _this.thisContext.drawImage(_this.thisVideo, 0, 0, _this.videoWidth, _this.videoHeight)
+
+      // 获取图片base64链接
+
+      var image = this.thisCancas.toDataURL('image/png')
+
+      _this.imgSrc = image
+
+      this.$emit('refreshDataList', this.imgSrc)
+    },
+
+    // base64转文件
+
+    dataURLtoFile(dataurl, filename) {
+      var arr = dataurl.split(',')
+
+      var mime = arr[0].match(/:(.*?);/)[1]
+
+      var bstr = atob(arr[1])
+
+      var n = bstr.length
+
+      var u8arr = new Uint8Array(n)
+
+      while (n--) {
+        u8arr[n] = bstr.charCodeAt(n)
+      }
+
+      return new File([u8arr], filename, { type: mime })
+    },
+
+    // 关闭摄像头
+
+    stopNavigator() {
+      this.thisVideo.srcObject.getTracks()[0].stop()
+    }
+
+  }
+
+}
+
+</script>
+

applications/dee-mes/src/views/taskExecution/index.vue

@@ -517,7 +517,7 @@
     <!-- 装配流程 -->
     <AssemblyProcess ref="AssemblyProcess" />
     <!-- 问题申报 -->
-    <!-- <ProblemDeclare ref="ProblemDeclare" /> -->
+    <ProblemDeclare ref="ProblemDeclare" />
     <!-- 检验驳回 驳回记录 -->
     <InspectionRejected ref="InspectionRejected" />
     <AttachmentUpload ref="AttachmentUpload" />
@@ -540,7 +540,7 @@ import ConfirmMaterial from './components/ConfirmMaterial/index'
 import TechnicalRequirements from './components/TechnicalRequirements/index'
 import AssemblyProcess from './components/AssemblyProcess/index'
 import InspectionRejected from './components/chatBox/index'
-// import ProblemDeclare from './components/ProblemDeclare/index'
+import ProblemDeclare from './components/ProblemDeclare/index'
 import RecordMaintenance from './components/RecordMaintenance/index'
 // import scan from '@/components/scanCode/scanCode'
 import AttachmentUpload from './components/AttachmentUpload/dialog'
@@ -553,7 +553,8 @@ export default {
     InspectionRejected,
     AssemblyProcess,
     RecordMaintenance,
-    ConfirmMaterial
+    ConfirmMaterial,
+    ProblemDeclare
   },
   data() {
     return {
@@ -716,6 +717,7 @@ export default {
             that.headerData = {
               id: data.id,
               serialNumber: data.extProcessPlan.serialNumber,
+              positionNumber: data.extProcessPlan.positionNumber,
               resName: data.extProcessPlan.planeType,
               serialNo: data.extProcessPlan.sorties,
               firstCheckFlag: data.extProcessPlan.firstCheckFlag === '是',
@@ -1260,14 +1262,34 @@ export default {
      */
     inspectionCompleted(dataUrl) {
       var that = this
-      let url
       if (this.$route.query.title === '适航任务执行') {
-        url = `/JoExecuteOpPlan/completeOp?joOpId=${that.procedureId}&joAoId=${that.headerData.id}&dmriImg=${dataUrl}`
+        post(
+          `/JoExecuteOpPlan/inspection?joOpId=${that.procedureId}&joAoId=${that.headerData.id}`,
+          { dmriImg: dataUrl }
+        )
+          .then((res) => {
+            if (res && res.message.includes('成功')) {
+              that.getWorkingProcedure()
+              this.$message({
+                showClose: true,
+                message: res.message,
+                type: 'success'
+              })
             } else {
-        url = `/JoExecuteOpPlan/completeOp?joOpId=${that.procedureId}&joAoId=${that.headerData.id}`
+              this.$message({
+                showClose: true,
+                message: res.message,
+                type: 'error'
+              })
             }
+          })
+          .catch((err) => console.error(err))
+          .finally(() => {
+            // that.editShow = false
+          })
+      } else {
         get(
-        url,
+          `/JoExecuteOpPlan/completeOp?joOpId=${that.procedureId}&joAoId=${that.headerData.id}`,
           {}
         )
           .then((res) => {
@@ -1290,6 +1312,7 @@ export default {
           .finally(() => {
             // that.editShow = false
           })
+      }
     },
     setRejected() {
       var that = this