？<template>
  <layout-form>
    <el-form
      :model="form"
      :loading="loading"
      :rules="rules"
      size="small"
      style="width: 100%"
      label-width="120px"
      ref="form"
    >
      <el-row>
        <Field
          label="材料名"
          prop="materialName"
          :span="24"
          v-model="form.materialName"
          placeholder="请输入材料名"
        />

        <Field
          label="材料形式"
          prop="materialProperty"
          v-model="form.materialProperty"
          :enumData="dict.materialProperty"
          placeholder="请输入材料形式"
          type="select"
        />
        <Field
          label="材料必要性"
          prop="isMust"
          v-model="form.isMust"
          :enumData="dict.isMust"
          placeholder="请选择是否必交"
          type="select"
        />
        <Field
          label="材料类型"
          prop="materialType"
          v-model="form.materialType"
          :enumData="dict.materialType"
          type="select"
          placeholder="请输入材料类型"
        />
        <Field
          label="电子材料格式"
          prop="electronicgs"
          v-model="form.electronicgs"
          :enumData="dict.electronicgs"
          type="select"
          placeholder="请输入电子材料格式"
        />
        <Field
          label="材料来源渠道"
          prop="materialSource"
          v-model="form.materialSource"
          :enumData="dict.materialSource"
          type="select"
          placeholder="请输入材料来源渠道"
        />
        <Field
          label="纸质材料份数"
          prop="paperNum"
          v-model="form.paperNum"
          placeholder="请输入纸质材料份数"
        />
        <Field
          label="纸质材料规格"
          prop="paperGg"
          v-model="form.paperGg"
          :enumData="dict.paperGg"
          type="select"
          placeholder="请输入纸质材料规格"
        />
        <Field
          label="减免模式"
          prop="jianmMs"
          v-model="form.jianmMs"
          :enumData="dict.jianmMs"
          type="select"
          placeholder="请输入减免模式"
        />
        <Field
          label="盖章方式"
          prop="sealWay"
          v-model="form.sealWay"
          :enumData="dict.sealWay"
          type="select"
          placeholder="请输入盖章方式"
        />
        <Field
          label="是否减免"
          prop="isjianm"
          v-model="form.isjianm"
          :enumData="dict.isjianm"
          type="select"
          placeholder="请输入是否减免"
        />
        <Field
          label="材料是否容缺"
          prop="isLack"
          v-model="form.isLack"
          :enumData="dict.isLack"
          type="radio"
          placeholder="请输入材料是否容缺"
        />

        <Field
          label="来源渠道说明"
          prop="materialSourceSm"
          type="textarea"
          v-model="form.materialSourceSm"
          placeholder="请输入来源渠道说明"
        />

        <!-- <Field :span="16" label="上传附件">
          <el-upload
            :action="upload.url + '?prePath=' + upload.prePath"
            :on-success="handleFileSuccess"
            multiple
            :file-list="fileList"
          >
            <el-button size="small">上传示例样表</el-button>
          </el-upload>
        </Field> -->

        <Field
          label="填报须知"
          prop="remarkSub"
          type="textarea"
          :span="24"
          v-model="form.remarkSub"
          placeholder="请输入填报须知"
        />
        <Field
          label="受理标准"
          prop="remark"
          type="textarea"
          :span="24"
          v-model="form.remark"
          placeholder="请输入受理标准"
        />
        <Field
          label="要求提供材料的依据"
          type="textarea"
          :span="24"
          prop="clauseContent"
          v-model="form.clauseContent"
          placeholder="请输入要求提供材料的依据"
        />
        <Field
          label="备注"
          prop="summary"
          v-model="form.summary"
          type="textarea"
          :span="24"
          placeholder="请输入备注"
        />
    

        <Field
          label="材料来源"
          prop="source"
            :span="24"
          v-model="form.source"
          :enumData="dict.source"
          type="select"
        />

      <Field :span="24" label="附件列表">
        <el-table
          class="down"
          :data="datumFileList"
          border
          stripe
          style="width: 100%; margin-top: 20px; margin-bottom: 10px"
        >
          <el-table-column prop="source" label="文件类型">
            <template slot-scope="scope">
              <span style="margin-left: 10px">{{
                scope.row.filetype == "1" ? "示例样表" : "空白表格"
              }}</span>
            </template>
          </el-table-column>

          <el-table-column prop="fileName" label="文件名称"></el-table-column>

          <el-table-column prop="fileUrl" label="下载地址"></el-table-column>

          <el-table-column width="150px" label="操作">
            <template slot-scope="scope">
              <el-button size="small" type="text">
                <el-link type="primary" @click="downloadDatumFile(scope.row)"
                  >下载</el-link
                >
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </Field>
  </el-row>
       <form-buttons  @submit="submitForm" /> 
    </el-form>
  </layout-form>
</template>

<script>
import form from "@/assets/mixins/form";
export default {
  mixins: [form],
  methods: {
    downloadDatumFile(row) {
      window.location.href = row.fileUrl;
    },
    beforeRender(data) {
      console.log("渲染前", data);

      if(!data.entity.id){
       return data;
      }

      //查询附件列表
  
      this.loading = true;
      this.$post("/matter/datum/file/list", {
        "query.datumid": data.entity.id,
      })
        .then((res) => {
          if (res && res.code && res.code == 1) {
            console.log(res);

            res.data.result.map((item) => this.datumFileList.push(item));

            this.loading = false;
          }
        })
        .catch((error) => {
          this.$message.error(error.message);
        });

      return data;
    },
    beforeSubmit(data) {
      data.valid = 0;
      return data;
    },
    afterSubmit(data) {
      console.log("submit", data);
      this.$router.go(-1);
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      //this.upload.isUploading = true;
    },
    handlePreview(file) {},
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      //更新fileList

      console.log(response, file, fileList);

      // this.upload.open = false;
      // this.upload.isUploading = false;
      // this.$refs.upload.clearFiles();
      // this.$message(response.msg);
      // this.getList();
    },
  },

  data() {
    
    return {
      upload: {
        // 是否禁用上传
        isUploading: false,
        prePath: "/data/",
        url: "/m/datum/upload",
      },
      datumFileList: [],
      fileList: [],
      toString: [
        "materialProperty",
        "isMust",
        "materialType",
        "electronicgs",
        "paperGg",
        "jianmMs",
        "sealWay",
        "isLack",
        "isjianm",
        "materialSource",
        "source"
      ],
      rules: {
        materialName: [
          {required: true, max: 256, message: "最多只能录入256个字符", trigger: "blur" },
        ],
        ybUrl: [
          { max: 256, message: "最多只能录入256个字符", trigger: "blur" },
        ],
        remarkSub: [
          { max: 256, message: "最多只能录入256个字符", trigger: "blur" },
        ],
        remark: [
          { max: 256, message: "最多只能录入256个字符", trigger: "blur" },
        ],
        clauseContent: [
          { max: 256, message: "最多只能录入256个字符", trigger: "blur" },
        ],
        summary: [
          { max: 256, message: "最多只能录入256个字符", trigger: "blur" },
        ],
        source: [
          { required: true, message: "请选择事项来源", trigger: "blur" },
        ],
      },
    };
  },
};
</script>