<template xmlns:v-slot="http://www.w3.org/1999/XSL/Transform">
  <div>
    <el-dialog
      :title="title"
      :close-on-click-modal="false"
	  draggable
      width="1200px"
      @close="close(),closeXTable()"
      @keyup.enter.native="doSubmit"
	  v-model="visible">
      <el-form size="large" :model="inputForm" ref="inputForm" :rules="rules" v-loading="loading" :class="method==='view'?'readonly':''"
               label-width="150px">
        <!--        附件-->
        <UpLoadComponent ref="uploadComponent"></UpLoadComponent>
      </el-form>
		<template #footer>
			<span class="dialog-footer">
      <el-button  @click="close(),closeXTable()" icon="el-icon-circle-close">关闭</el-button>
      <el-button  type="primary" v-if="method != 'view'" @click="doSubmit()" icon="el-icon-circle-check" v-noMoreClick >确定</el-button>
			</span>
		</template>
    </el-dialog>
  </div>
</template>

<script>
  import UpLoadComponent from '@/views/common/UpLoadComponent'
  import OSSSerive from '@/api/sys/OSSService'
  export default {
    data () {
      return {
        visable: false,
        gridData: [],
		tableKey: '',
        radio: 0,
        tableData: [],
        dataList: [],
        dataListNew: [],
        title: '',
        method: '',
        visible: false,
        loading: false,
        inputForm: {
        },
		  attachmentId: '',
		  moduleType: '',
        rogress: 0, // 动态显示进度条
        progressFlag: false, // 关闭进度条
      }
    },
    components: {
      UpLoadComponent
    },
    ossService: null,
    workClientService: null,
    created () {
      this.ossService = new OSSSerive()
    },
    mounted () {
    },
    methods: {
      // 关闭查看器
      closeViewer () {
        this.url = ''
        this.showViewer = false
      },
      async init (method, id,projectId) {
      	console.log('id', id )
      	console.log('projectId', projectId )
      	this.attachmentId = id
      	this.moduleType = projectId
        this.dataList = []
        this.dataListNew = []
        await this.ossService.getFileListByAttachmentIdAndModuleType(id,projectId).then((data) => {
        	console.log('data',data)
			if(data){
				data.forEach((item) => {
					item.name = item.attachmentName
					this.dataList.push(item)
					this.dataListNew.push(item)
				})
			}
        })
        this.method = method
        this.inputForm = {

        }
        this.inputForm.id = id
		  this.title = '上传附件'
        this.visible = true
        this.loading = false
		  this.$nextTick(() => {
          // this.$refs.upload.clearFiles()
          this.$refs.inputForm.resetFields()
            this.$refs.uploadComponent.newUpload(method, this.dataList, 'workClient', 300)
          this.loading = false
        })
      },
      // 表单提交
      doSubmit () {
        if (this.$refs.uploadComponent.checkProgress()) {
          this.loading = false
          return
        }
        this.$refs['inputForm'].validate((valid) => {
          if (valid) {
            this.loading = true
            this.inputForm.workAttachments = []
            this.dataListNew = this.$refs.uploadComponent.getDataList()
            this.dataListNew.forEach((item) => {
              if (item.id === null || item.id === undefined || item.id === '') {
                item.url = item.raw.url
              }
              item.attachmentFlag = 'ccpmWorkClient'
              item.fileSize = item.size
              item.attachmentName = item.name
              item.createBy = null
				item.attachmentId = this.attachmentId
				item.moduleType = this.moduleType
              this.inputForm.workAttachments.push(item)
            })
			  this.$emit('getFiles',this.dataListNew)
			console.log(this.inputForm)
            this.ossService.save(this.inputForm.workAttachments).then((data) => {
              this.close()
              this.$message.success(data)
              // this.$emit('refreshDataList')
              this.loading = false
            }).catch(() => {
              this.loading = false
            })
          }
        })
      },
      close () {
        this.$refs.uploadComponent.clearUpload()
        this.$refs.inputForm.resetFields()
        this.visible = false
        this.showVi = true
      },
      // 关闭窗口时调用
      closeXTable () {
        this.bankInfos = []
        this.linkmanInfos = []
        this.closePop()
      },
      closePop () {
        this.visable = false
      }
    }
  }
</script>

<style>
  .tid_40 .vxe-body--column .vxe-cell{
    padding: 1px;
    text-align: center;
  }
  .tid_40 .vxe-header--row .col--last{
    text-align: center;
  }
  .tid_45 .vxe-body--column .vxe-cell{
    padding: 1px;
    text-align: center;
  }
  .tid_45 .vxe-header--row .col--last{
    text-align: center;
  }
</style>

<style scoped>
  .avatar{
    height: 100px;
  }
  .el-divider__text {
    font-weight: bold;
    font-size: 16px;
  }
  .readonly-text input {
	  color: red; /* 设置只读文本的字体颜色为红色 */
  }
</style>
