管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2023-03-21 c2a697c7399dcfb3ebae5333f05f91f488d2cb41
src/views/Archive/index.vue
@@ -54,7 +54,7 @@
          >
            <el-option
              v-for="item in categoryOptions"
              :key="item.value"
              :key="item.key"
              :label="item.value"
              :value="item.key"
            >
@@ -123,6 +123,19 @@
              class="el-input__icon el-icon-search"
            ></i></el-input>
        </el-form-item>
        <!-- 批量下載 -->
        <el-form-item
          style="float:right"
          v-if="formInline.dataType =='type2'"
        >
          <el-button
            type="success"
            size="small"
            icon="el-icon-download"
            @click="setCardDownload"
          >{{$t('common.download')}}</el-button>
        </el-form-item>
        <!-- 空间查询 -->
        <el-form-item style="float:right">
          <el-button
@@ -162,6 +175,12 @@
            >
              <span v-show="formInline.dataType =='type2'">
                <el-checkbox
                  v-model="item.ischecked"
                  @change="handleCheckedDataTypeChange(item)"
                  style="margin-right:10px"
                >
                </el-checkbox>
                <span v-if="item.ismeta > 0">
                  <el-link
                    style="color: #409eff"
@@ -181,17 +200,25 @@
              <span v-show="formInline.dataType !='type2'">{{item.tabDesc}}</span>
              <div style="float: right; padding: 3px 0">
                <i
                  v-show="formInline.dataType=='type2' "
                  v-if="showView(item, /[]/)"
                  class="el-icon-view"
                  :title="$t('common.preview')"
                  @click="setAttatchFileView(index, item)"
                ></i>
                <i
                  style="margin-left:10px"
                  class="el-icon-tickets"
                  :title="$t('common.details')"
                  @click="setCardDetails(item)"
                ></i>
                <i
                <!-- <i
                  v-show="formInline.dataType=='type2'"
                  style="margin-left:10px"
                  class="el-icon-download"
                  :title="$t('common.download')"
                  @click="setCardDownload(item)"
                ></i>
                ></i> -->
                <i
                  v-show="!item.isShow"
                  style="margin-left:10px"
@@ -216,6 +243,8 @@
              <div class="cardItem"> {{$t('archiveObj.dataType')}} : {{ item.mold }} </div>
              <div class="cardItem"> {{$t('dataManage.vmobj.format')}} : {{ item.type }} </div>
              <div class="cardItem"> {{$t('dataManage.vmobj.size')}} : {{stateFormatSizes(item.sizes)}} </div>
              <div class="cardItem"> {{$t('dataManage.vmobj.tab')}} : {{ item.tab }} </div>
              <div class="cardItem"> {{$t('dataManage.vmobj.row')}} : {{ item.rows }} </div>
              <div class="cardItem"> {{$t('archiveObj.downloads')}} : {{ item.downCount }} 次 </div>
              <div class="cardItem"> {{$t('dataManage.vmobj.createonuser')}} : {{item.uname}} </div>
              <div class="cardItem"> {{$t('dataManage.vmobj.depName')}} : {{item.depName}} </div>
@@ -232,6 +261,7 @@
            </div>
          </el-card>
        </div>
      </div>
      <div class="archBottomBox">
        <div style="margin-top:10px">
@@ -261,6 +291,10 @@
        <p>{{ $t('dataManage.vmobj.format') }}:{{ itemdetail1.type }}</p>
        <el-divider></el-divider>
        <p>{{ $t('common.size') }}:{{ stateFormatSizes(itemdetail1.sizes) }}</p>
        <el-divider></el-divider>
        <p>{{ $t('dataManage.vmobj.tab') }}:{{  itemdetail1.tab }}</p>
        <el-divider></el-divider>
        <p>{{ $t('dataManage.vmobj.row') }}:{{itemdetail1.rows }}</p>
        <el-divider></el-divider>
        <p>{{ $t('archiveObj.downloads') }}:{{ itemdetail1.downCount }} 次</p>
        <el-divider></el-divider>
@@ -465,6 +499,103 @@
          >确 定</el-button>
        </span>
      </el-dialog>
      <!-- 数据库附件信息 -->
      <el-dialog
        :title="$t('common.enclosure')"
        :visible.sync="outerVisible"
        :close-on-click-modal="false"
        width="50%"
        :modal="false"
      >
        <div style="height:68vh">
          <el-form
            :model="fromfile"
            class="demo-form-inline"
          >
            <el-form-item>
              <el-input
                v-model="fromfile.file"
                style="width: 300px; margin-right: 20px"
                :placeholder="$t('common.choose')"
                disabled
              ></el-input>
              <input
                name="file1"
                type="file"
                id="insertFile"
                multiple="multiple"
                style="display: none"
                @change="insertFile( )"
              />
              <el-link
                @click="getInsertFile( )"
                :underline="false"
              ><i class="el-icon-folder-opened"></i></el-link>
            </el-form-item>
            <el-form-item>
              <el-row>
                <el-col :span="2">
                  <el-link
                    class="elLink"
                    :underline="false"
                    @click="setAttachInsert"
                  >{{$t('common.append')}}</el-link>
                </el-col>
                <el-col :span="2">
                  <el-link
                    class="elLink"
                    :underline="false"
                    @click="setAttachDel"
                  >{{$t('common.delete')}}</el-link>
                </el-col>
              </el-row>
            </el-form-item>
          </el-form>
          <el-table
            :data="tableAttach"
            ref="filterTable"
            height="calc(100% - 130px)"
            border
            style="width: 100%"
            @selection-change="handleAttatchChange"
          >
            <el-table-column
              type="selection"
              width="70"
            />
            <el-table-column
              width="60"
              type="index"
              :label="$t('common.index')"
            />
            <el-table-column
              prop="name"
              :label="$t('common.fileNme')"
            />
            <el-table-column
              prop="sizes"
              :label="$t('common.size')"
              :formatter="statSizeChange"
            />
            <el-table-column
              align="center"
              :label="$t('common.operate')"
              min-width="100"
            >
              <template slot-scope="scope">
                <el-link
                  v-if="matchState(scope, /[]/)"
                  @click="setAttatchDetail(scope.$index, scope.row)"
                  class="elLink"
                >{{ $t('common.see') }}</el-link>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </el-dialog>
      <!-- 数据库Table信息 -->
      <div style="height:68vh">
        <el-form
          :model="formInline"
@@ -910,6 +1041,37 @@
        </div>
      </div>
    </el-dialog>
    <el-dialog
      title="预览"
      :append-to-body="false"
      :visible.sync="dialog.dialogVisible"
      width="70%"
      :close-on-click-modal="false"
    >
      <div
        v-if="dialog.isPdf"
        class="pdfClass"
      >
        <iframe
          :src="dialog.src"
          type="application/x-google-chrome-pdf"
          width="100%"
          height="100%"
        >
        </iframe>
      </div>
      <div
        v-if="dialog.isJpg"
        class="pdfClass"
      >
        <img
          style="width:100%; height:100%"
          :src="dialog.src"
          alt=""
        />
      </div>
    </el-dialog>
    <iframe
      id="downFrame"
      src=""
@@ -938,8 +1100,11 @@
  dataLib_selectDownloadFile,
  dataLib_selectPageCountForDownload,
  dataLib_selectPageAndCountByPid,
  dataLib_selectMetaById
  dataLib_selectMetaById,
  dataLib_selectFiles,
  dataLib_deletes
} from '../../api/api';
import { dataLibView } from '@/api/screen.js'
export default {
  components: {
    MyBread, MapSdk
@@ -966,6 +1131,7 @@
      }
    };
    return {
      fromfile: { file: '' },
      fromSqlflag: false,
      filedsOption: [],
      condOption: [],
@@ -1054,8 +1220,24 @@
      },
      queryMetaFlag: false,
      metaDataTable: [],
      upAttach: {
        tabName: null,
        eventid: null,
      },
      outerVisible: false,
      tableAttach: [],
      dataLib_selectFiles: [],
      attacgSelection: [],
      dialog: {
        dialogVisible: false,
        isPdf: false,
        isJpg: false,
        src: ''
      },
      checkedDataType: [],
    };
  },
  mounted() {
    this.getDepTreeData();
    this.getCategorySelectData();
@@ -1063,6 +1245,169 @@
    this.signGetPublicKey();
  },
  methods: {
    //批量下载复选框chagne
    handleCheckedDataTypeChange(res) {
      var std = 0;
      for (var i = 0; i < this.multipleSelection1.length; i++) {
        if (res.guid == this.multipleSelection1[i].guid) {
          std = i;
        }
      }
      if (std == 0) {
        this.multipleSelection1.push(res);
      } else {
        this.multipleSelection1.splice(std, 1)
      }
      console.log(this.multipleSelection1)
    },
    matchState(state = "", reg) {
      var row = state.row;
      var name = row.name;
      if (name.indexOf('.pdf') != -1 || name.indexOf('.jpg') != -1 || name.indexOf('.gif') != -1 || name.indexOf('.png') != -1 || name.indexOf('.jpeg') != -1) {
        return true;
      }
      return false;
    },
    // 附件=>表格选择
    handleAttatchChange(val) {
      this.attacgSelection = val;
    },
    //附件=>文件选择
    getInsertFile() {
      $('#insertFile').click();
    },
    insertFile() {
      var val = document.getElementById('insertFile').files;
      if (!val || !val.length) return;
      this.fromfile.file = val[0].name;
    },
    getAttachTable(index, row) {
      if (row.eventid != null) {
        this.upAttach.eventid = row.eventid;
      } else {
        this.upAttach.eventid = "";
      }
      this.outerVisible = true;
      this.getAttacthFlieList();
    },
    //附件列表查询
    async getAttacthFlieList() {
      var obj = this.upAttach;
      const res = await dataLib_selectFiles(obj);
      if (res.code != 200) {
        this.$message.error('列表调用失败');
        return
      }
      this.tableAttach = res.result;
    },
    refreshAttatchDetail() {
      this.dialog.src = "";
      this.dialog.dialogVisible = false;
      this.dialog.isPdf = false;
      this.dialog.isJpg = false;
    },
    //附件查看
    setAttatchDetail(index, row) {
      this.refreshAttatchDetail()
      var name = row.name;
      if (name.indexOf('.pdf') != -1) {
        this.dialog.dialogVisible = true;
        this.dialog.isPdf = true;
        var url = BASE_URL + "/comprehensive/downloadForView?guid=" + row.guid + "&token=" + getToken();
        this.dialog.src = url
      } else if (name.indexOf('.jpg') != -1 || name.indexOf('.gif') != -1 || name.indexOf('.png') != -1 || name.indexOf('.jpeg') != -1) {
        this.dialog.dialogVisible = true;
        this.dialog.isJpg = true;
        var url = BASE_URL + "/comprehensive/downloadForView?guid=" + row.guid + "&token=" + getToken();
        this.dialog.src = url
      }
    },
    setAttatchFileView(index, row) {
      this.refreshAttatchDetail()
      var name = `${row.name}.${row.type}`;
      if (name.indexOf('.pdf') != -1) {
        this.dialog.isPdf = true;
      } else if (name.indexOf('.jpg') != -1 || name.indexOf('.gif') != -1 || name.indexOf('.png') != -1 || name.indexOf('.jpeg') != -1) {
        this.dialog.isJpg = true;
      }
      this.dialog.dialogVisible = true;
      var url = BASE_URL + "/dataLib/downloadForView?guid=" + row.guid + "&token=" + getToken();
      this.dialog.src = url;
    },
    showView(res) {
      var name = res.type
      if (name) {
        if (name.indexOf('pdf') != -1 || name.indexOf('jpg') != -1 || name.indexOf('gif') != -1 || name.indexOf('png') != -1 || name.indexOf('jpeg') != -1) {
          return true
        } else {
          return false
        }
      }
    },
    //附件刪除
    async setAttachDel() {
      var std = [];
      for (var i in this.attacgSelection) {
        std.push(this.attacgSelection[i].id);
      }
      const res = await dataLib_deletes({ ids: std.toString() });
      if (res.code != 200) {
        this.$message.error('文件删除失败');
      }
      this.getAttacthFlieList();
    },
    //附件列表新增
    setAttachInsert() {
      var token = getToken();
      var fs = document.getElementById("insertFile");
      if (fs.files.length == 0) {
        this.$message({
          message: '请选择要上传的文件!',
          type: 'warning'
        });
        return;
      }
      const formData = new FormData()
      for (var i = 0, c = fs.files.length; i < c; i++) {
        formData.append('file', fs.files[i]); // fs.files[i].name,file
      }
      $.ajax(BASE_URL + "/dataQuery/uploadFiles?token=" + token + "&tabName=" + this.upAttach.tabName + "&eventid=" + this.upAttach.eventid, {
        type: "post",
        data: formData,
        async: true,
        cache: false,
        processData: false,
        contentType: false,
        success: (rs) => {
          this.$message({
            message: '附件添加成功',
            type: 'success'
          });
          document.getElementById("insertFile").value = "";
          this.fromfile = {
            file: '',
          }
          this.getAttacthFlieList();
        },
        error: (e) => {
          document.getElementById("insertFile").value = "";
          this.fromfile = {
            file: '',
          }
          this.$message.error('附件添加失败');
        }
      });
    },
    setRestMetaData() {
      this.fromQueryMeta.name = "";
      this.listMetaData.name = this.fromQueryMeta.name;
@@ -1278,7 +1623,7 @@
      }
      var obj = {
        entities: [this.listBankData.name], // bpachydrogeology,bhydrogeologyattach
        filter: this.formInline.filter,
        filter: this.listBankData.filter,
        pwd: encrypt.encrypt(this.codeForm.password),
        depcodes: [this.listData.depcode],
        dirs: this.listData.dirs
@@ -1370,6 +1715,11 @@
      $("#downFrame").attr("src", url).click();
      this.closeDown();
      this.monthdata.filter((res) => {
        return res.ischecked = false;
      })
      this.multipleSelection1 = [];
    },
    closeDown() {
      this.passWorldVisible = false;
@@ -1378,8 +1728,8 @@
    },
    //文件下载
    setCardDownload(res) {
      this.multipleSelection1 = [];
      this.multipleSelection1.push(res);
      // this.multipleSelection1 = [];
      // this.multipleSelection1.push(res);
      if (this.multipleSelection1.length == 0) {
        this.$message({
          message: '请先选择要下载的文件',
@@ -1391,15 +1741,21 @@
    },
    //重置
    setQuerAllTablesRefresh() {
      this.formInline = {
        fileName: "",//高级搜索
        dataType: "type2", //数据类型
        category: [], //查询类别,
        item: [],
        depcode: this.depOption[0].code,
        depName: this.depOption[0].name,
        keywords: '',
      }
      // this.formInline = {
      //   fileName: "",//高级搜索
      //   dataType: "type2", //数据类型
      //   category: [], //查询类别,
      //   item: [],
      //   depcode: null, //单位,
      //   depName: null,//单位,
      //   keywords: '',
      // }
      this.formInline.fileName = "";//高级搜索
      this.formInline.category = [];//高级搜索
      this.formInline.item = [];//高级搜索
      this.formInline.depcode = null;//高级搜索
      this.formInline.depName = null;//高级搜索
      this.formInline.keywords = "";//高级搜索
      this.getAllTabesData();
    },
    handleSelectionChange() {
@@ -1424,6 +1780,7 @@
      this.listBankData.pageIndex = 1;
      this.listBankData.pageSize = 10;
      this.listBankData.title = res.tabDesc;
      this.upAttach.tabName = res.ns + "." + res.tab;
      this.filedsLayer = this.getBankTableFiled();
      this.getCollapseTable(this.filedsLayer);
    },
@@ -1465,13 +1822,26 @@
        }
      }
      for (var i in data.result) {
        if (data.result[i].createtime != null) {
        if (data.result[i].createtime) {
          data.result[i].createtime = this.format(data.result[i].createtime)
        }
        if (data.result[i].updatetime != null) {
        if (data.result[i].updatetime) {
          data.result[i].updatetime = this.format(data.result[i].updatetime)
        }
        data.result[i].createuser = data.result[i].createName
        data.result[i].updateuser = data.result[i].updateName
        if (data.result[i].verName) {
          data.result[i].verid = data.result[i].verName
        }
        if (data.result[i].depName) {
          data.result[i].depid = data.result[i].depName
        }
        if (data.result[i].dirName) {
          data.result[i].dirid = data.result[i].dirName
        }
      }
      this.listBankData.count = data.count;
      this.tableData = data.result;
@@ -1605,6 +1975,9 @@
    add0(m) {
      return m < 10 ? '0' + m : m;
    },
    statSizeChange(row, column) {
      return this.stateFormatSizes(row.sizes)
    },
    stateFormatSizes(res) {
      if (res >= 1024) {
        const val = parseFloat(res / 1024).toFixed(3);
@@ -1623,7 +1996,6 @@
      this.listData.pageIndex = 1;
      this.listData.pageSize = val;
      switch (this.formInline.dataType) {
        case "type2"://文件数据
          this.getQueryFileData();
          break;
@@ -1636,7 +2008,6 @@
    handleCurrentChange(val) {
      this.listData.pageIndex = val;
      switch (this.formInline.dataType) {
        case "type2"://文件数据
          this.getQueryFileData();
          break;
@@ -1700,19 +2071,24 @@
        return;
      }
      var val = data.result;
      val = val.filter((res) => {
      if (val) {
        val = val.filter((res) => {
          res.mold = "数据库"
          res.isShow = false
          return res;
        })
        this.listData.count = data.count;
        this.monthdata = data.result;
      } else {
        this.listData.count = 0;
        this.monthdata = [];
      }
        res.mold = "数据库"
        res.isShow = false
        return res;
      })
      this.listData.count = data.count;
      this.monthdata = data.result;
    },
    //查询文件数据
    async getQueryFileData() {
      this.listData.dirs = "";
      this.listData.count = 0;
      if (this.formInline.category.length != 0) {
        this.listData.dirs += this.formInline.category.toString();
      }
@@ -1723,22 +2099,31 @@
        this.listData.dirs += this.formInline.item.toString();
      }
      this.listData.depcode = this.formInline.depcode;
      this.listData.tab = this.formInline.keywords;
      this.listData.name = this.formInline.keywords;
      const data = await dataLib_selectByPageForMeta(this.listData);
      if (data.code != 200) {
        this.$message.error('文件数据列表调用失败');
      }
      var val = data.result;
      val = val.filter((res) => {
        var type = "." + res.type;
        res.name = res.name.replaceAll(type, "")
        res.mold = "文件"
        res.isShow = false
        return res;
      })
      this.monthdata = val;
      this.listData.count = data.count;
      var val = data.result;
      if (val) {
        val = val.filter((res) => {
          var type = "." + res.type;
          res.name = res.name.replaceAll(type, "")
          res.mold = "文件";
          res.isShow = false;
          res.ischecked = false;
          return res;
        })
        this.monthdata = val;
        this.listData.count = data.count;
      } else {
        this.monthdata = [];
        this.listData.count = 0;
      }
    },
    //查询数据
    getAllTabesData() {
@@ -1768,6 +2153,7 @@
      if (data.code != 200) {
        this.$message.error('资料类别列表调用失败');
      }
      this.categoryOptions = data.result;
    },
    //关键字查询
@@ -1783,7 +2169,9 @@
    },
    //资料类别下拉框值改变触发
    categorySelectChange(model, prop, options) {
      this.getAllTabesData();
    },
    // 项目名称下拉框值改变触发
    itemSelectChange(model, prop, options) {
@@ -1796,8 +2184,8 @@
        return this.$message.error('单位列表获取失败');
      }
      this.depOption = this.treeData(data.result);
      this.formInline.depcode = this.depOption[0].code
      this.formInline.depName = this.depOption[0].name;
      // this.formInline.depcode = this.depOption[0].code
      // this.formInline.depName = this.depOption[0].name;
      this.getAllTabesData();
    },
    //树列表生成
@@ -1893,5 +2281,10 @@
      justify-content: center;
    }
  }
  .pdfClass {
    height: 70vh;
    width: 100%;
    position: relative;
  }
}
</style>