<template>
  <div>
    <el-form ref="form" class="el-form-box" :model="form" label-width="90px">
      <headerTitle title="基本信息"></headerTitle>
      <el-row>
        <el-col :span="12">
          <el-form-item label="来源类型" prop="relationType">
            <el-select
              v-model="form.relationType"
              @change="relationTypeChange"
              style="width: 100%"
              disabled
            >
              <el-option
                :value="item.value"
                :label="item.label"
                v-for="(item, index) in relationTypeList"
                :key="index"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <!-- <el-col :span="12">
          <el-form-item label="变更合同" prop="contractName">
            <el-input
              v-model="form.contractName"
              @click.native="selectContract"
              readonly
              :disabled="dialogType == 'view'"
            ></el-input>
          </el-form-item>
        </el-col> -->
        <el-col :span="12" v-if="form.relationType == 100">
          <el-form-item label="变更订单" prop="relationCode">
            <el-input
              v-model="form.relationCode"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="附件" prop="file">
            <fileMain v-model="form.file" type="view"></fileMain>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="变更原因" prop="reason">
            <el-input v-model="form.reason" disabled type="textarea"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="变更描述" prop="remark">
            <el-input v-model="form.remark" disabled type="remark"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
  import { mapGetters } from 'vuex';
  import { getDetail } from '@/api/bpm/components/changeManage/index.js';
  // import fileMain from '@/components/addDoc/index.vue';
  import { relationTypeList } from '@/enum/dict.js';

  const defForm = {
    name: '',
    changeCode: '',
    file: [], //条件
    remark: '',
    type: '',
    describes: '',
    relationId: '',
    relationName: '',
    relationCode: '',
    relationType: ''
  };
  export default {
    // components: { fileMain },
    computed: {
      ...mapGetters(['user'])
    },
    props: {
      businessId: {
        default: ''
      }
    },
    data() {
      return {
        form: {
          ...defForm
        }
      };
    },
    created() {
      this.getInfo(this.businessId);
    },
    methods: {
      //获取详情
      async getInfo(id) {
        this.form = await getDetail(id);
      }
    }
  };
</script>
<style scoped lang="scss"></style>
