1.sop上传接口接入

loulijun2021

2022-12-06 f7eedc924df60b69353b190dc3579ef7d0852019

 src/views/xtsz/sc.vue

@@ -12,17 +12,15 @@
          >
            <div class="elForm" style="justify-content: flex-start">
              <el-form-item style="margin-right: 30px">
                <el-checkbox v-model="form.checked">备选项</el-checkbox>
                <el-checkbox v-model="checked" @change="checkedChange">最新版本</el-checkbox>
              </el-form-item>
              <el-form-item>
                <!--                prefix-icon="el-icon-search"-->
                <el-input v-model="form.search" placeholder="请输入关键字" style="width: 260px" />
              </el-form-item>
            </div>
          </el-form>
          <el-button type="primary" style="margin-left: 30px" icon="el-icon-search" @click="search">查询</el-button>
          <el-button type="info" icon="el-icon-refresh" @click="reset">重置</el-button>

        </div>
      </div>

@@ -47,7 +45,7 @@
            label="序号"
          />
          <el-table-column
            prop="file_name"
            prop="define_name"
            label="文件名称"
            min-width="160"
            show-tooltip-when-overflow
@@ -95,7 +93,7 @@
          <el-table-column
            prop="lm_date"
            label="上传时间"
            width="160"
            min-width="160"
            sortable="custom"
          />
          <el-table-column
@@ -105,8 +103,8 @@
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <el-tooltip class="item" effect="dark" content="预览" placement="top">
                  <i class="el-icon-files" style="cursor: pointer;color:#42b983;margin-right: 15px" @click="check" />
                <el-tooltip v-del-tab-index class="item" effect="dark" content="预览" placement="top">
                  <i class="el-icon-files" style="cursor: pointer;color:#42b983;margin-right: 15px" @click="check(row)" />
                </el-tooltip>
                <el-tooltip v-del-tab-index class="item" effect="dark" content="删除" placement="top">
                  <i class="el-icon-delete" @click="del(row)" />
@@ -172,9 +170,10 @@
            />
          </el-select>
        </el-form-item>
        <el-form-item label="文件名称" prop="defilename">
          <el-input v-model="dialogForm.defilename" style="width: 200px" />
        </el-form-item>
        <!--        <el-form-item label="文件名称" prop="defilename">-->
        <!--        <el-form-item label="文件名称">-->
        <!--          <el-input v-model="dialogForm.defilename" disabled style="width: 200px" />-->
        <!--        </el-form-item>-->
        <el-form-item label="文件类型" prop="filetypecode">
          <el-select
            v-model="dialogForm.filetypecode"
@@ -192,10 +191,10 @@
            />
          </el-select>
        </el-form-item>

        <el-form-item label="版本号">
          <el-input v-model="dialogForm.fileversion" disabled style="width: 200px" />
        </el-form-item>
        <el-form-item label="文件上传" prop="Files">
          <!--          <el-input v-model="dialogForm.Files" style="width: 200px" />-->

          <div style="width: 200px;">
            <el-upload
              ref="uploadFileRef"
@@ -208,8 +207,6 @@
              :multiple="false"
              accept=".mp4,.pdf"
            >
              <!--              :http-request="upload"-->
              <!--              :before-upload="beforeUpload"-->
              <el-button
                type="primary"
                style="width: 200px;display: flex;justify-content: center"
@@ -219,15 +216,16 @@
            </el-upload>
          </div>
        </el-form-item>
        <el-form-item label="版本号">
          <el-input v-model="dialogForm.fileversion" disabled style="width: 200px" />
        </el-form-item>

      </el-form>
      <span slot="footer" class="dialog-footer">
        <div class="footerButton">
          <el-button @click="dialogVisibleCancel">取 消</el-button>
          <el-button type="primary" @click="dialogVisibleConfirm">确 定</el-button>
          <el-button
            type="primary"
            :loading="$store.state.app.buttonIsDisabled"
            :disabled="$store.state.app.buttonIsDisabled"
            @click="dialogVisibleConfirm"
          >确 定</el-button>
        </div>
      </span>
    </el-dialog>
@@ -237,9 +235,14 @@

<script>
import Pagination from '@/components/Pagination'
import { AddUpdateOrganization, DeleteOrganization, PrentOrganization } from '@/api/jcsz'
import { getCookie } from '@/utils/auth'
import { SystemSopDelete, SystemSopDeviceSearch, SystemSopMaxVersion, SystemSopSava, SystemSopSearch } from '@/api/xtsz'
import {
  SystemSopDelete,
  SystemSopDeviceSearch,
  SystemSopMaxVersion,
  SystemSopSava,
  SystemSopSearch,
  SystemSopView
} from '@/api/xtsz'
import { PartSelect } from '@/api/zzmx'

export default {
@@ -254,13 +257,15 @@
      mainHeight: 0,
      tableHeight: 0,
      form: {
        checked: '', // 是否选中最高版本
        check: 'N', // 是否选中最高版本
        search: '', // 搜索关键字
        prop: 'lm_date', // 排序字段
        order: 'desc', // 排序字段
        page: 1, // 第几页
        rows: 20 // 每页多少条
      },
      checked: false,

      total: 10,
      tableData: [],
      dialogVisible: false,
@@ -285,10 +290,6 @@
        filetypecode: [
          { required: true, message: '请选择文件类型', trigger: ['blur', 'change'] }
        ]
        // Files: [
        //   { required: true, message: '请输入文件名称', trigger: ['blur', 'change'] }
        // ]

      },
      devicetvpeArr: [], // 设备类型下拉列表
      partArr: [], // 物料下拉列表
@@ -297,6 +298,7 @@
        { code: 'P002', name: '检验指导书' },
        { code: 'P003', name: '图纸' }
      ]

    }
  },

@@ -330,42 +332,24 @@
    search() {
      this.getSystemSopSearch()
    },
    // 导入按钮
    // upload(param) {
    //   console.log('111')
    //   this.dialogForm.Files = param.file
    // },
    // 文件上传之前方法
    // beforeUpload(file) {
    // console.log(file, 1)
    // const isLt100M = file.size / 1024 / 1024 < 100
    // // if (['video/mp4', 'video/ogg', 'video/flv', 'video/avi', 'video/wmv', 'video/rmvb'].indexOf(file.type) == -1) {
    // if (['video/mp4', '.pdf'].indexOf(file.type) === -1) {
    //   this.$message.error('上传文件只能是 pdf、mp4 格式!')
    //   // this.$message.error('上传视频只能是 mp4、ogg、flv、avi、wmv、rmvb 格式!')
    //   return false
    // }
    // if (!isLt100M) {
    //   this.$message.error('上传文件大小不能超过 100MB!')
    //   return false
    // }
    // return true
    // },
    // 最新版本改变时触发
    checkedChange(val) {
      this.form.check = val ? 'Y' : 'N'
      this.getSystemSopSearch()
    },
    // 文件数量超过限定触发
    handleExceed() {
      this.$message.info('暂不支持多文件上传！')
    },

    // 重置
    reset() {
      this.form.checked = ''
      this.form.search = ''
      this.getSystemSopSearch()
    },

    // 新增按钮
    add() {
      this.dialogVisible = true

      this.getSystemSopDeviceSearch()
      this.getPartSelect()
    },
@@ -379,7 +363,6 @@
      const { data: res } = await PartSelect()
      this.partArr = res
    },

    // 文件类型值改变时
    async fileversionChange(val, type) {
      const data = {
@@ -391,21 +374,10 @@

      this.dialogForm.fileversion = res
    },

    // 预览
    check() {
      const url = this.$router.resolve({
        path: '/xtsz/yl',
        query: {
          // clue_id: row.clue_id,
          // operation: 'check',
          name: '文件预览'
        }
      })

      window.open(url.href)

      // SystemSopView
    async  check(row) {
      const { data: res } = await SystemSopView({ id: row.id, filepath: row.file_path })
      window.open(res)
    },

    // 删除按钮
@@ -416,8 +388,8 @@
        type: 'warning'
      }).then(() => {
        const data = {
          id: '',
          filepath: ''
          id: row.id,
          filepath: row.file_path
        }
        SystemSopDelete(data).then(res => {
          if (res.code === '200') {
@@ -440,16 +412,17 @@
      this.dialogForm.filetypecode = ''
      this.dialogForm.fileversion = ''
      this.dialogForm.Files = ''
      this.$refs.uploadFileRef.clearFiles()
      this.$refs.dialogForm.clearValidate()
    },
    // 对话框取消
    dialogVisibleCancel() {
      this.dialogVisible = false
      this.$store.state.app.buttonIsDisabled = false
    },
    // 对话框确认
    dialogVisibleConfirm() {
      console.log(this.$refs.uploadFileRef.uploadFiles[0])

      if (!this.$refs.uploadFileRef.uploadFiles[0]) {
        this.$message.info('请选择文件上传！')
      }
@@ -457,25 +430,25 @@
      this.$refs.dialogForm.validate(valid => {
        if (valid) {
          const formData = new FormData()
          formData.append('devicetvpecode', this.dialogForm.devicetvpecode)
          formData.append('devicetypecode', this.dialogForm.devicetvpecode)
          formData.append('partcode', this.dialogForm.partcode)
          formData.append('defilename', this.dialogForm.defilename)
          formData.append('defilename', this.$refs.uploadFileRef.uploadFiles[0].name)
          formData.append('filetypecode', this.dialogForm.filetypecode)
          formData.append('fileversion', this.dialogForm.fileversion)
          formData.append('Files', this.$refs.uploadFileRef.uploadFiles[0].raw)
          // formData.append('Files', JSON.stringify(this.$refs.uploadFileRef.uploadFiles[0].raw))
          // formData.append('Files', JSON.stringify(this.$refs.uploadFileRef.uploadFiles[0]))
          for (var [key, value] of formData) {
            console.log(key, value)
          }
          // 参考文件上传地方，明天看
          // for (var [key, value] of formData) {
          //   console.log(key, value)
          // }
          this.$store.state.app.buttonIsDisabled = true
          SystemSopSava(formData).then(res => {
            if (res.code === '200') {
              this.$message.success('文件上传成功！')
              this.dialogVisible = false
              this.$store.state.app.buttonIsDisabled = false
              this.getSystemSopSearch()
            } else {
              this.$message.error('文件上传失败！')
              this.$store.state.app.buttonIsDisabled = false
            }
          })
        }