X-web/src/views/modules/sale/contract-change.vue

<template>
    <div>
        <div class="my-title">合同更改</div>
        <!-- 表单 -->
      <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="auto">
        <el-row class="my-row">
          <el-form-item label="更改内容描述" prop="changeContentDesc">
            <el-input type="textarea" v-model="dataForm.changeContentDesc" placeholder="请输入更改内容描述"></el-input>
          </el-form-item>
        </el-row>
        <el-row class="my-row">
          <upload-component :title="'合同更改通知单'" :accept="'*'" :file-obj-list="fileList" @uploadSuccess="uploadSuccess"/>
        </el-row>
      </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="onChose">取消</el-button>
          <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
        </span>
    </div>
</template>

<script>
  import UserComponents from '../common/user-components'
  import UploadComponent from '../common/upload-component'
  import { getContractDetail } from '@/api/sale'

export default {
    name: 'contract-change',
    components: {
      UploadComponent,
      UserComponents
    },
    computed: {
      orgId: {
        get () { return this.$store.state.user.orgId }
      }
    },
    data () {
      return {
        visible: false,
        dataForm: {
          changeContentDesc: ''
        },
        id: 0,
        fileList: [],
        dataRule: {
          changeContentDesc: [{ required: true, message: '更改内容简述不能为空', trigger: 'blur' }]
        }
      }
    },
    methods: {
      onChose () {
        this.$emit('onChose')
      },
      async init (id) {
        this.fileList = []
        this.visible = true
        this.id = id || 0
        if (!id) return
        this.dataForm.contractId = id
        await getContractDetail(id).then(({data}) => {
          if (data && data.code === '200' && data.data) {
            this.dataForm.changeContentDesc = data.data.changeContentDesc
            if (data.data.noticeAttachList) {
              data.data.noticeAttachList.forEach((item) => {
                this.fileList.push({
                  name: item.fileName,
                  url: item.url,
                  id: item.url
                })
              })
            }
          } else {
            this.$message.error(data.msg)
          }
        })
      },
      validateField (type) {
        this.$refs.dataForm.validateField(type)
      },
      // 表单提交
      dataFormSubmit () {
        // 附件
        let fList = this.fileList
        if (fList.length > 0) {
          this.dataForm.noticeAttachList = []
          for (let i = 0; i < fList.length; i++) {
            this.dataForm.noticeAttachList.push({
              fileName: fList[i].name,
              url: fList[i].url
            })
          }
        } else {
          this.$message.error('请上传文件')
          return
        }
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.$http({
              url: this.$http.adornUrl(`/biz-service/purPurchaseContract/changeContract`),
              method: 'post',
              data: this.$http.adornData({...this.dataForm, orgId: this.orgId})
            }).then(({data}) => {
              if (data && data.code === '200') {
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.onChose()
                    this.$emit('refreshDataList')
                  }
                })
              } else {
                this.$message.error(data.msg)
              }
            })
          }
        })
      },
      uploadSuccess (fileList) {
        this.fileList = fileList
      }
    }
  }
</script>

<style scoped>

</style>