<template>
  <el-dialog
    :title="$t2('文件详情', 'components.fileLibrary.fileDetail')"
    :append-to-body="true"
    :modal-append-to-body="falseValue"
    :close-on-click-modal="falseValue"
    :visible.sync="showDialog"
    :modal="falseValue"
    custom-class="dialog-style list-dialog"
    width="700px"
    height="500px"
    @close="dialogClose"
    v-el-drag-dialog
    v-el-dialog-center
  >
    <div id="containt">
      <div class="detail-wrap">
        <el-form ref="editForm" :model="attachmentDTO">
          <div class="d-header clearfix">
            <div class="fl">
              <i class="el-icon-info" />
              {{ $t2("文件详情", "components.fileLibrary.fileDetail") }}
            </div>
            <div class="fr">
              <el-button
                type="primary"
                class="button-sty"
                icon="el-icon-check"
                @click="saveData"
                v-if="isEdit && attachmentDTO.status != 1"
                >{{ $t2("保存", "system.button.save") }}
              </el-button>
            </div>
          </div>
          <baseTabs>
            <baseTabPane :label="$t2('基本信息', 'system.label.baseInfo')">
              <template #default>
                <table class="table-detail">
                  <tbody>
                    <tr>
                      <th>{{ $t2("文件路径", "components.fileLibrary.filePath") }}</th>
                      <td colspan="3">
                        <el-breadcrumb separator-class="el-icon-arrow-right">
                          <el-breadcrumb-item
                            v-for="(pathName, index) in pathNameArr"
                            :key="index"
                            >{{ pathName }}
                          </el-breadcrumb-item>
                        </el-breadcrumb>
                      </td>
                    </tr>
                    <tr>
                      <th>
                        {{ $t2("文件名称", "components.fileLibrary.fileName") }}
                      </th>
                      <td colspan="3">
                        <el-input v-model="fileName" clearable v-if="isEdit">
                          <template slot="append">{{ filePrefix }}</template>
                        </el-input>
                        <template v-else>{{ attachmentDTO.fileName }}</template>
                      </td>
                    </tr>
                    <tr>
                      <th>{{ $t2("所属对象描述", "components.fileLibrary.note") }}</th>
                      <td colspan="3">{{ attachmentDTO.note }}</td>
                    </tr>
                    <tr>
                      <th>{{ $t1("文件类型名") }}</th>
                      <td colspan="3">
                        <b>{{ attachmentDTO.fileTypeName }}</b>
                      </td>
                    </tr>
                    <tr>
                      <th>{{ $t2("文件大小", "components.fileLibrary.fileSize") }}</th>
                      <td>{{ formatFileSize(attachmentDTO.fileSize) }}</td>
                      <th>{{ $t2("版本号", "components.fileLibrary.fileRev") }}</th>
                      <td>{{ attachmentDTO.rev }}</td>
                    </tr>
                    <tr>
                      <th>{{ $t2("分辨率", "components.fileLibrary.widthHeight") }}</th>
                      <td>{{ attachmentDTO.widthHeight }}</td>
                      <th>{{ $t2("是否归档", "components.fileLibrary.status") }}</th>
                      <td>{{ attachmentDTO.status == 1 ? "已归档" : "未归档" }}</td>
                    </tr>
                    <!--                  <tr>
                                      <th>状态</th>
                                      <td>{{ attachmentDTO.status == 1 ? '归档' : '未归档' }}</td>
                                    </tr>-->
                    <tr>
                      <th>{{ $t2("文件编码", "components.fileLibrary.fileSn") }}</th>
                      <td colspan="3">{{ attachmentDTO.fileSn }}</td>
                    </tr>
                    <tr>
                      <th>{{ $t2("创建人", "system.label.createBy") }}</th>
                      <td>{{ attachmentDTO._createBy }}</td>
                      <th>{{ $t2("创建时间", "system.label.createDate") }}</th>
                      <td>{{ attachmentDTO.createDate }}</td>
                    </tr>
                  </tbody>
                </table>
              </template>
            </baseTabPane>
            <baseTabPane :label="$t2('文件属性', 'components.fileLibrary.fileAttribute')">
              <template #button>
                <el-button
                  class="button-sty"
                  @click="addItem"
                  icon="el-icon-plus"
                  v-if="isEdit && attachmentDTO.status != 1"
                >
                  {{ $t2("新增文件属性", "components.fileLibrary.addFileAttribute") }}
                </el-button>
              </template>
              <template #default>
                <vxe-grid
                  ref="table-m1"
                  class="vxe-tableNo"
                  height="224px"
                  :data="attachmentDTO.fileAttachAttributeDTOs"
                  v-bind="vxeOption"
                  @resizable-change="$vxeTableUtil.onColumnWitchChange"
                  @custom="$vxeTableUtil.customHandle"
                >
                  <template #attributeName="{ row, rowIndex }">
                    <el-form-item
                      :prop="'fileAttachAttributeDTOs.' + rowIndex + '.attributeName'"
                      :rules="[{ required: true, trigger: 'blur' }]"
                    >
                      <el-input v-model="row.attributeName" clearable v-if="isEdit" />
                      <template v-else>{{ row.attributeName }}</template>
                    </el-form-item>
                  </template>
                  <template #attributeValue="{ row }">
                    <el-input v-model="row.attributeValue" clearable v-if="isEdit" />
                    <template v-else>{{ row.attributeValue }}</template>
                  </template>
                  <template #operate="{ row, rowIndex }">
                    <a
                      class="a-link"
                      @click="attachmentDTO.fileAttachAttributeDTOs.splice(rowIndex, 1)"
                      v-if="isEdit"
                    >
                      <el-tooltip
                        :enterable="false"
                        effect="dark"
                        :content="$t2('删除', 'components.fileLibrary.delete')"
                        placement="top"
                        popper-class="tooltip-skin"
                      >
                        <i class="el-icon-delete" />
                      </el-tooltip>
                    </a>
                  </template>
                </vxe-grid>
              </template>
            </baseTabPane>
            <baseTabPane :label="$t1('文件关联对象')">
              <template #button></template>
              <template #default>
                <vxe-grid
                  ref="table-m2"
                  class="vxe-tableNo"
                  height="224px"
                  :data="fileAttachObjDTOs"
                  v-bind="vxeOption2"
                  @resizable-change="$vxeTableUtil.onColumnWitchChange"
                  @custom="$vxeTableUtil.customHandle"
                ></vxe-grid>
              </template>
            </baseTabPane>
          </baseTabs>
        </el-form>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import mixins from "./mixins/propertiesDialogMixins";

export default {
  mixins: [mixins],
};
</script>
