opms_frontend/src/views/work/train/sale/components/finish.vue

<template>
  <el-dialog title="反馈" :visible.sync="dialogFormVisible" @close="close">
    <el-form ref="form" :model="form" :rules="rules">
      <el-row :gutter="20">
        <!-- <el-col :span="24">
          <el-form-item label="讲解时长" prop="explainDuration">
            <el-input v-model="form.explainDuration" />
          </el-form-item>
        </el-col> -->
        <el-col :span="24">
          <el-form-item label="提问记录" prop="questionRecord">
            <el-input v-model="form.questionRecord" :rows="2" type="textarea" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="培训效果总结" prop="trainSummary">
            <el-input v-model="form.trainSummary" :rows="2" type="textarea" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="下一步工作计划" prop="nextStep">
            <el-upload
              ref="uploadRef"
              action="#"
              :before-upload="
                (file) => {
                  return beforeAvatarUpload(file)
                }
              "
              :http-request="uploadRequest"
              :limit="1">
              <el-button size="mini" type="primary">点击上传</el-button>
            </el-upload>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template #footer>
      <el-button @click="close">取 消</el-button>
      <el-button type="primary" @click="save">确 定</el-button>
    </template>
  </el-dialog>
</template>

<script>
  import Api from '@/api/work/trainSale'
  import axios from 'axios'
  import asyncUploadFile from '@/utils/uploadajax'

  export default {
    name: 'WorkOrderFeedback',
    data() {
      return {
        fileList: [],
        fileSettings: {
          // 文件配置信息
          fileSize: 52428800,
          fileTypes: '.pdf,.doc,.docx,.zip,.xls,.xlsx,.rar,.jpg,.jpeg,.gif,.png,.jfif,.txt',
          pictureSize: 52428800,
          pictureTypes: '.jpg,.jpeg,.gif,.png,.jfif,.txt',
          types: '.pdf,.doc,.docx,.zip,.xls,.xlsx,.rar,.jpg,.jpeg,.gif,.png,.jfif,.mp4,.txt',
          videoSize: 104857600,
          videoType: '.mp4',
        },
        form: {
          orderId: undefined,
          explainDuration: undefined,
          questionRecord: undefined,
          trainSummary: undefined,
          nextStep: undefined,
        },
        rules: {
          explainDuration: [{ required: true, message: '不能为空', trigger: ['blur', 'change'] }],
          questionRecord: [{ required: true, message: '不能为空', trigger: ['blur', 'change'] }],
          trainSummary: [{ required: true, message: '不能为空', trigger: ['blur', 'change'] }],
        },
        dialogFormVisible: false,
      }
    },
    mounted() {},
    methods: {
      // 上传附件
      beforeAvatarUpload(file) {
        let flag1 = file.size < this.fileSettings.fileSize
        if (!flag1) {
          this.$message.warning('文件过大，请重新选择！')
          return false
        }
        let flag2 = this.fileSettings.fileTypes.split(',').includes('.' + file.name.split('.').pop())
        if (!flag2) {
          this.$message.warning('文件类型不符合，请重新选择！')
          return false
        }
        return true
      },
      // 上传
      uploadRequest(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(() => {
                _this.form.fileName = option.file.name
                _this.form.fileUrl = `${process.env.VUE_APP_PROTOCOL}${res.data.publicUrl}/${res.data.fid}` // 资料存储url
              })
            } else {
              _this.$message({
                type: 'warning',
                message: '未上传成功！请刷新界面重新上传！',
              })
            }
          })
          .catch(function () {
            _this.$message({
              type: 'warning',
              message: '未上传成功！请重新上传！',
            })
          })
      },
      showEdit(row) {
        this.form = {
          applyId: row.id,
          explainDuration: undefined,
          questionRecord: undefined,
          trainSummary: undefined,
          nextStep: undefined,
        }
        this.dialogFormVisible = true
      },
      close() {
        this.$refs['form'].resetFields()
        this.form = this.$options.data().form
        this.dialogFormVisible = false
      },
      save() {
        this.$refs['form'].validate(async (valid) => {
          if (valid) {
            console.log(this.form)
            this.form.nextStep = this.form.fileUrl
            const { msg } = await Api.doAddSummary(this.form)
            this.$baseMessage(msg, 'success', 'vab-hey-message-success')
            this.$emit('fetch-data')
            this.close()
          }
        })
      },
    },
  }
</script>