soc_web/src/views/core/edu/plan/dialog.select.file.vue

<template>
  <DialogCom
    title="选取知识库文件"
    :visible.sync="isShow"
    class="g-dialog-select-safe-check"
    :close-on-click-modal="false"
    width="55%"
    top="10vh"
    append-to-body
  >
    <div class="el-dialog-div" style="margin-bottom:20px">
      <g-search-table
        ref="st"
        url="/core/materials/fileList"
        method="post"
        :search-data="search"
        :pageable="true"
        :select="true"
        :select-default="selectList"
        :drag="false"
        @select="onSelect"
      >
        <!-- 搜索 -->
        <template slot="searchs">
          <el-form-item prop="title" label="资料名称">
            <el-input v-model="search.title" placeholder="请输入资料名称"/>
          </el-form-item>
          <el-form-item prop="fileName" label="文件名称">
            <el-input v-model="search.fileName" placeholder="请输入文件名称"/>
          </el-form-item>
        </template>

        <!-- 表格 -->
        <template slot="columns">
          <el-table-column
            prop="orgName"
            label="上传机构"
            width="250"
          ></el-table-column>
          <el-table-column label="资料名称" prop="title" width="300"> </el-table-column>
          <el-table-column
            label="文件名称"
          >
          <template slot-scope="scope">
            <template v-if="scope.row.fileList">
              <el-tag style="cursor: pointer;margin-right: 5px;" size="mini" type="success" effect="plain" @click="downLoadFile(JSON.parse(item).url)" v-for="(item, index) in scope.row.fileList"
                      :key="index">
                {{ JSON.parse(item).name }}
              </el-tag>
            </template>
          </template>
        </el-table-column>
          <!--          <el-table-column prop="nfcName"
                           label="采集点"
                           width="120"></el-table-column>-->
        </template>
      </g-search-table>
    </div>

    <div slot="footer" class="dialog-footer">
      <el-button @click="onHide">关闭</el-button>
      <el-button type="primary" @click="onSubmit">确定</el-button>
    </div>
  </DialogCom>
</template>
<script>
import GSearchTable from "@/components/table/gx.search.table.vue";
// import { ruleListForOrg } from "@/api/resumption/rule.js";
export default {
  components: { GSearchTable },
  data() {
    return {
      isShow: false,
      selectList: [],
      // ruleList: [],
      search: this.emptySearch(),
    };
  },
  computed: {},
  watch: {
    orgId(newval) {
      console.log("orgId",newval);
      this.search.orgId=newval;
    },
  },
  props: {
    defaultSelect:{
      type:Array
    },
    orgId:{

    },
  },
  methods: {
    show() {
      this.search= this.emptySearch();
      console.log("this.search",this.search)
      this.isShow = true;
      this.selectList =this.defaultSelect;
      // TODO: 处理第一次进入弹窗时，表格数据不加载
    },
    onHide() {
      this.isShow = false;
      this.search=this.emptySearch();
    },
    onSelect(item) {
      this.selectList = item;
    },
    onSubmit() {
      let s=this.selectList
      this.$emit("select", this.selectList);
      this.onHide();
    },
    emptySearch() {
      return {
        title: null,
        fileName: null,
        orgId:this.$store.getters.orgId,
        // t:new Date(),
      };
    },
    downLoadFile(url)
    {
        if(process.env.VUE_APP_BASE_API!=='/')
        {
          url=process.env.VUE_APP_BASE_API+url;
        }
        const a = document.createElement("a");
        a.setAttribute("download", name);
        a.setAttribute("target", "_blank");
        a.setAttribute("href", url);
        a.click();
    }
  },
  mounted() {

  },
};
</script>
<style lang="scss" scoped>
.el-dialog-div {
  overflow: auto;
}
</style>