管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2023-01-16 21ddc9ec1b1b76d2ce20e512328e65acaf1af2bf
src/views/Archive/index.vue
@@ -44,11 +44,14 @@
        </el-form>
      </div>
    </div>
    <!--
    <div class="box_item">
      <div class="box_left">资料类别</div>
      <div class="box_cont">
        <div class="box_div" v-for="(item, index) in showList" :key="index">
        <div
          class="box_div"
          v-for="(item, index) in showList"
          :key="index"
        >
          <el-checkbox
            v-if="isShowFirstCheck"
            v-model="item.isCheckedFlag"
@@ -58,10 +61,16 @@
        </div>
      </div>
      <div class="box_right">
        <div class="box_div box_menu" @click="moreEvent(1)">
        <div
          class="box_div box_menu"
          @click="moreEvent(1)"
        >
          {{ $t('synthesis.more') }}
        </div>
        <div class="box_div box_menu" @click="checkEvent(1)">
        <div
          class="box_div box_menu"
          @click="checkEvent(1)"
        >
          <i class="el-icon-plus"></i> {{ $t('synthesis.Multiplechoice') }}
        </div>
      </div>
@@ -69,7 +78,11 @@
    <div class="box_item">
      <div class="box_left">项目名称</div>
      <div class="box_cont">
        <div class="box_div" v-for="(item, index) in showList1" :key="index">
        <div
          class="box_div"
          v-for="(item, index) in showList1"
          :key="index"
        >
          <el-checkbox
            v-if="isShowSecondCheck"
            v-model="item.isCheckedFlag"
@@ -79,14 +92,20 @@
        </div>
      </div>
      <div class="box_right">
        <div class="box_div box_menu" @click="moreEvent(2)">
        <div
          class="box_div box_menu"
          @click="moreEvent(2)"
        >
          {{ $t('synthesis.more') }}
        </div>
        <div class="box_div box_menu" @click="checkEvent(2)">
        <div
          class="box_div box_menu"
          @click="checkEvent(2)"
        >
          <i class="el-icon-plus"></i> {{ $t('synthesis.Multiplechoice') }}
        </div>
      </div>
    </div> -->
    </div>
    <div class="bottom_content">
      <div class="bottom_left">
        <!-- <div class="box_div">当前搜索关键词:</div> -->
@@ -153,7 +172,7 @@
          </el-form-item>
          <el-form-item>
            <el-cascader
              v-model="queryForm.dirid"
              v-model="queryForm.depid"
              :show-all-levels="false"
              :options="companyOption1"
              @change="handleChange1"
@@ -166,121 +185,56 @@
            }"
            ></el-cascader>
          </el-form-item>
          <!-- <el-form-item :label="$t('dataManage.vmobj.keyword')" >
    <el-input v-model="queryForm.name" :placeholder="$t('common.pleaseInput')"></el-input>
  </el-form-item> -->
          <!-- <el-form-item>
  <el-button
            @click="queryInfo()"
            icon="el-icon-search"
            class="primary"
            size="small"
            >{{ $t('common.iquery') }}</el-button
          >
        </el-form-item> -->
          <!-- <el-form-item>
          <el-button
            @click="resetInfo('queryForm')"
            icon="el-icon-refresh"
            type="info"
            size="small"
            >{{ $t('common.reset') }}</el-button
          >
        </el-form-item> -->
          <el-form-item>
            <el-button
              type="danger"
              size="small"
              @click="deleteMetaInfo"
              icon="el-icon-delete"
            >{{ $t('common.delete') }}</el-button>
          </el-form-item>
          <el-form-item>
          </el-form-item> -->
          <!-- <el-form-item>
            <el-button
              @click="downFormData"
              @click="setBatchDownload"
              icon="el-icon-download"
              type="success"
              size="small"
            >{{ $t('common.download') }}</el-button>
          </el-form-item>
            >批量下载</el-button>
          </el-form-item> -->
        </el-form>
        <el-table
          :data="tableData1"
          style="width: 100%"
          @selection-change="handleSelectionChange1"
          height="500px"
        <div
          class="boxCard"
          v-for="(item,index) in tableData1"
        >
          <el-table-column
            type="selection"
            width="55"
          />
          <el-table-column
            prop="name"
            :label="$t('dataManage.vmobj.name')"
          />
          <el-table-column
            prop="type"
            :label="$t('dataManage.vmobj.format')"
          />
          <el-table-column
            prop="sizes"
            :label="$t('dataManage.vmobj.size')"
            :formatter="stateFormatSizes"
          />
          <el-table-column
            prop="depName"
            :label="$t('dataManage.vmobj.depName')"
          />
          <el-table-column
            prop="dirName"
            :label="$t('dataManage.vmobj.dirName')"
          />
          <el-card class="box-card">
            <div
              slot="header"
              class="clearfix"
            >
              <span>{{item.name}}</span>
          <el-table-column :label="$t('dataManage.dataUpObj.tableName')">
            <template slot-scope="scope">
              <a @click="showDetail2(scope.row)">{{
          scope.row.tab
        }}</a>
            </template>
          </el-table-column>
              <div style="float: right; padding: 3px 0">
                <i
                  @click="showDetail1(item)"
                  class="el-icon-tickets"
                ></i>
                <i
                  style="margin-left:10px"
                  @click="setFileDownload(item)"
                  class="el-icon-download"
                ></i>
              </div>
            </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.createonuser')}} : {{item.uname}} </div>
            <div class="cardItem"> {{$t('dataManage.vmobj.depName')}} : {{item.depName}} </div>
            <div class="cardItem"> {{$t('dataManage.vmobj.createontime')}} : {{format(item.createTime)}} </div>
          </el-card>
        </div>
          <el-table-column
            prop="gather"
            :label="$t('dataManage.vmobj.gather')"
            :formatter="formatData"
          />
          <el-table-column
            prop="describe"
            :label="$t('dataManage.vmobj.describe')"
          />
          <el-table-column
            prop="uname"
            :label="$t('dataManage.vmobj.createonuser')"
          />
          <el-table-column
            prop="createTime"
            :label="$t('dataManage.vmobj.createontime')"
            :formatter="formatData"
          />
          <el-table-column
            min-width="100"
            :label="$t('common.operate')"
          >
            <template slot-scope="scope">
              <el-link
                style="color: white"
                @click="showDetail1(scope.row)"
              >{{
                  $t('common.details')
                }}</el-link>
              <!-- <el-link
                  @click="editInfo(scope.row)"
                  style="margin-left: 10px; color: white"
                  >{{ $t('common.edit') }}</el-link
                > -->
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <div class="panerPage">
@@ -301,7 +255,7 @@
      :title="dialogtitle"
      :visible.sync="dialogVisible"
      width="90%"
      top="10vh"
      top="5vh"
      :before-close="handleClose"
    >
      <!-- 条件-->
@@ -483,7 +437,7 @@
          </el-form-item>
        </el-form>
      </el-dialog>
      <div style="height: 700px">
      <div style="max-height: 580px">
        <el-form
          v-if="isMenuActive"
          ref="ruleForm"
@@ -525,53 +479,56 @@
          </el-form-item>
        </el-form>
        <el-divider class="eldivider" />
        <el-table
          ref="filterTable"
          :data="tableData"
          height="76%"
          border
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column
            type="selection"
            align="center"
            width="55"
          />
          <el-table-column
            width="60"
            type="index"
            align="center"
            :label="$t('common.index')"
            :index="indexAdd"
          />
          <el-table-column
            v-for="(item, index) in attributeData"
            :key="index"
            :label="item.alias"
            :prop="item.field"
            show-overflow-tooltip
            align="center"
          ></el-table-column>
          <el-table-column
            v-if="isMenuActive"
            min-width="80"
            align="center"
            :label="$t('common.operate')"
        <div style="width:100%;height:400px;">
          <el-table
            ref="filterTable"
            :data="tableData"
            height="100%"
            border
            style="width: 100%"
            @selection-change="handleSelectionChange"
          >
            <template slot-scope="scope">
              <el-link
                class="elLink"
                @click="showDetail(scope.$index, scope.row)"
              >{{ $t('common.details') }}</el-link>
              <el-link
                class="elLink"
                @click="getAttachTable(scope.$index, scope.row)"
                style="margin-left: 20px"
              >{{ $t('common.enclosure') }}</el-link>
            </template>
          </el-table-column>
        </el-table>
            <el-table-column
              type="selection"
              align="center"
              width="55"
            />
            <el-table-column
              width="60"
              type="index"
              align="center"
              :label="$t('common.index')"
              :index="indexAdd"
            />
            <el-table-column
              v-for="(item, index) in attributeData"
              :key="index"
              :label="item.alias"
              :prop="item.field"
              show-overflow-tooltip
              align="center"
            ></el-table-column>
            <el-table-column
              v-if="isMenuActive"
              min-width="80"
              align="center"
              :label="$t('common.operate')"
            >
              <template slot-scope="scope">
                <el-link
                  class="elLink"
                  @click="showDetail(scope.$index, scope.row)"
                >{{ $t('common.details') }}</el-link>
                <el-link
                  class="elLink"
                  @click="getAttachTable(scope.$index, scope.row)"
                  style="margin-left: 20px"
                >{{ $t('common.enclosure') }}</el-link>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="panerPage">
          <div class="pagination_box">
            <el-pagination
@@ -634,71 +591,153 @@
        </el-form-item>
      </el-form>
    </div>
    <div
      class="infoBox"
      v-show="showinfoBox1"
    <el-dialog
      :title="$t('common.details')"
      :visible.sync="showinfoBox1"
      width="30%"
    >
      <el-card class="box-card">
        <div
          slot="header"
          class="clearfix"
        >
          <span>{{ $t('common.details') }}</span>
          <div
            style="float: right; cursor: pointer"
            @click="closeDetial"
          >
            <i class="el-icon-close"></i>
          </div>
        </div>
        <div class="contentBox">
          <p>{{ $t('dataManage.vmobj.name') }}:{{ itemdetail1.name }}</p>
          <el-divider></el-divider>
          <p>{{ $t('dataManage.vmobj.format') }}:{{ itemdetail1.type }}</p>
          <el-divider></el-divider>
          <p>{{ $t('common.size') }}:{{ setInfoBoxSize(itemdetail1.sizes) }}</p>
          <el-divider></el-divider>
          <p>{{ $t('dataManage.vmobj.depName') }}:{{ itemdetail1.depName }}</p>
          <el-divider></el-divider>
          <p>
            {{ $t('dataManage.vmobj.gather') }}:{{
      <div class="contentBox">
        <p>{{ $t('dataManage.vmobj.name') }}:{{ itemdetail1.name }}</p>
        <el-divider></el-divider>
        <p>{{ $t('dataManage.vmobj.format') }}:{{ itemdetail1.type }}</p>
        <el-divider></el-divider>
        <p>{{ $t('common.size') }}:{{ setInfoBoxSize(itemdetail1.sizes) }}</p>
        <el-divider></el-divider>
        <p>{{ $t('dataManage.vmobj.depName') }}:{{ itemdetail1.depName }}</p>
        <el-divider></el-divider>
        <p>
          {{ $t('dataManage.vmobj.gather') }}:{{
              setInfoBoxTime(itemdetail1.gather)
            }}
          </p>
          <el-divider></el-divider>
          <p>
            {{ $t('dataManage.vmobj.describe') }}:{{ itemdetail1.describe }}
          </p>
          <el-divider></el-divider>
          <p>
            {{ $t('dataManage.vmobj.createonuser') }}:{{ itemdetail1.uname }}
          </p>
          <el-divider></el-divider>
          <p>
            {{ $t('dataManage.vmobj.createontime') }}:{{
        </p>
        <el-divider></el-divider>
        <p>
          {{ $t('dataManage.vmobj.describe') }}:{{ itemdetail1.describe }}
        </p>
        <el-divider></el-divider>
        <p>
          {{ $t('dataManage.vmobj.createonuser') }}:{{ itemdetail1.uname }}
        </p>
        <el-divider></el-divider>
        <p>
          {{ $t('dataManage.vmobj.createontime') }}:{{
              setInfoBoxTime(itemdetail1.createTime)
            }}
          </p>
          <el-divider></el-divider>
          <p>
            {{ $t('dataManage.vmobj.updateonuser') }}:{{
        </p>
        <el-divider></el-divider>
        <p>
          {{ $t('dataManage.vmobj.updateonuser') }}:{{
              itemdetail1.updateUser
            }}
          </p>
          <el-divider></el-divider>
          <p>
            {{ $t('dataManage.vmobj.updateontime') }}:{{
        </p>
        <el-divider></el-divider>
        <p>
          {{ $t('dataManage.vmobj.updateontime') }}:{{
              setInfoBoxTime(itemdetail1.updateTime)
            }}
          </p>
        </p>
      </div>
    </el-dialog>
    <el-dialog
      title="批量下载"
      :visible.sync="batchDownloadVisible"
      width="90%"
      top="5vh"
      :before-close="batchDownloadClose"
    >
      <div
        style="float:right;margin-right:10px"
        @click="downBatchFormData()"
      ><i
          style="color:#FFF"
          class="el-icon-download"
        ></i></div>
      <div style="height:580px">
        <el-table
          :data="tableData2"
          style="width: 100%"
          @selection-change="handleSelectionChange1"
          height="500px"
        >
          <el-table-column
            type="selection"
            width="55"
          />
          <el-table-column
            prop="name"
            :label="$t('dataManage.vmobj.name')"
          />
          <el-table-column
            prop="type"
            :label="$t('dataManage.vmobj.format')"
          />
          <el-table-column
            prop="sizes"
            :label="$t('dataManage.vmobj.size')"
            :formatter="stateFormatSize"
          />
          <el-table-column
            prop="depName"
            :label="$t('dataManage.vmobj.depName')"
          />
          <el-table-column
            prop="dirName"
            :label="$t('dataManage.vmobj.dirName')"
          />
          <el-table-column :label="$t('dataManage.dataUpObj.tableName')">
            <template slot-scope="scope">
              <a @click="showDetail2(scope.row)">{{
          scope.row.tab
        }}</a>
            </template>
          </el-table-column>
          <el-table-column
            prop="gather"
            :label="$t('dataManage.vmobj.gather')"
            :formatter="formatData"
          />
          <el-table-column
            prop="describe"
            :label="$t('dataManage.vmobj.describe')"
          />
          <el-table-column
            prop="uname"
            :label="$t('dataManage.vmobj.createonuser')"
          />
          <el-table-column
            prop="createTime"
            :label="$t('dataManage.vmobj.createontime')"
            :formatter="formatData"
          />
          <el-table-column
            min-width="100"
            :label="$t('common.operate')"
          >
          </el-table-column>
        </el-table>
        <div class="panerPage">
          <div class="pagination_box">
            <el-pagination
              @size-change="batchSizeChange"
              @current-change="batchCurrentChange"
              :current-page="batchPage.pageIndex"
              :page-sizes="[10, 20, 30, 40]"
              :page-size="batchPage.pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="batchPage.count"
            >
            </el-pagination>
          </div>
        </div>
      </el-card>
    </div>
      </div>
    </el-dialog>
    <el-dialog
      :title=" $t('synthesis.rangequery')"
      :visible.sync="dialogMapVisible"
      width="90%"
      :before-close="handleMapClose"
    >
      <div style="height:700px">
        <map-sdk v-if='showMapVisible'></map-sdk>
@@ -771,9 +810,9 @@
        value: '',
        type: '',
        date: '',
      },
        fromSqlflag: false,
      fromSqlflag: false,
      filedsOption: [],
      condOption: [],
      queryForm: {
@@ -802,11 +841,13 @@
      dialogVisible: false,
      innerVisible: false,
      outerVisible: false,
      batchDownloadVisible: false,
      dataType: [],
      filedsLayer: [],
      attributeData: [],
      tableData: [],
      tableData1: [],
      tableData2: [],
      multipleSelection: [],
      multipleSelection1: [],
      attacgSelection: [],
@@ -824,7 +865,9 @@
      listData: {
        pageIndex: 1,
        pageSize: 10,
        tab: ''
        depid: null,
        dirid: null,
        name: null
      },
      count: 0,
      count1: 0,
@@ -842,6 +885,11 @@
      upAttach: {
        tabName: null,
        eventid: null,
      },
      batchPage: {
        pageIndex: 1,
        pageSize: 10,
        count: 0
      }
    };
  },
@@ -858,7 +906,7 @@
      if (this.showFirstAll == false) {
        var showList = [];
        if (this.newList.length > 8) {
          for (var i = 0; i < 14; i++) {
          for (var i = 0; i < 10; i++) {
            showList.push(this.newList[i]); //将数组的前7条存放到showList数组中
          }
        } else {
@@ -942,19 +990,29 @@
      }
    },
    getMenuChange(res) {
      this.listData.pageSize = 10;
      this.listData.pageIndex = 1;
      this.formInline.tab = ""
      switch (res) {
        case 1:
          this.listData = {
            pageIndex: 1,
            pageSize: 10,
          }
          this.getDataLibSelectTabs();
          this.isMenuActive = true;
          break;
        case 2:
          this.listData = {
            pageIndex: 1,
            pageSize: 10,
            depid: null,
            dirid: null,
            name: null
          }
          this.getQueryDirTree();
          this.isMenuActive = false;
          break;
      }
@@ -970,8 +1028,8 @@
      this.companyOption = this.treeData(res.result);
      this.getQueryDepTree();
    },
     async getQueryDepTree(){
   const res = await selectdepTab();
    async getQueryDepTree() {
      const res = await selectdepTab();
      if (res.code != 200) {
        this.$message.error('单位列表获取失败');
        return;
@@ -1025,6 +1083,46 @@
          this.$message('已取消删除');
        });
    },
    getBatchMetaData() {
      this.batchPage.dirid = '1'
      this.batchPage.depid = '1';
      dataLib_selectByPageForMeta(this.batchPage).then((res) => {
        this.batchPage.count = res.count;
        this.tableData2 = res.result;
      });
    },
    batchSizeChange(val) {
      this.batchPage.pageSize = val;
      this.batchPage.pageIndex = 1;
      this.getBatchMetaData();
    },
    batchCurrentChange(val) {
      this.batchPage.pageIndex = val;
      this.getBatchMetaData();
    },
    downBatchFormData() {
      this.batchDownloadClose();
      this.downFormData();
    },
    batchDownloadClose() {
      this.batchDownloadVisible = false;
      this.batchPage = {
        pageIndex: 1,
        pageSize: 10,
        count: 0
      }
    },
    setBatchDownload() {
      this.getBatchMetaData();
      this.multipleSelection1 = [];
      this.batchDownloadVisible = true;
    },
    setFileDownload(res) {
      this.multipleSelection1 = [];
      this.multipleSelection1.push(res);
      this.downFormData();
    },
    downFormData() {
      if (this.multipleSelection1.length == 0) {
        alert('请先选择要下载的文件');
@@ -1071,12 +1169,14 @@
    },
    getMetaData() {
      this.listData.dirid = this.queryForm.dirid
      this.listData.depid = this.queryForm.dirid;
      this.listData.depid = this.queryForm.depid;
      dataLib_selectByPageForMeta(this.listData).then((res) => {
        this.tableData1 = res.result;
        this.count = res.count;
      });
    },
    handleChange(value) {
      this.listData.pageSize = 10;
      this.listData.pageIndex = 1;
@@ -1522,12 +1622,19 @@
      }
    },
    //单位转换
    stateFormatSizes(row, column) {
      if (row.sizes >= 1024) {
        const val = parseFloat(row.sizes / 1024).toFixed(3);
    stateFormatSize(row, column) {
      let data = row[column.property];
      if (data == null) {
        return data;
      }
      return this.stateFormatSizes(data);
    },
    stateFormatSizes(res) {
      if (res >= 1024) {
        const val = parseFloat(res / 1024).toFixed(3);
        return val + ' GB';
      } else {
        return row.sizes + ' MB';
        return res + ' MB';
      }
    },
    setInfoBoxTime(res) {
@@ -1592,7 +1699,7 @@
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  overflow-y: auto;
  background: #353539;
  .top_header {
    width: calc(100% - 60px);
@@ -1704,9 +1811,18 @@
    .bottom_right {
      width: calc(100% - 320px);
      padding: 0px 20px;
      max-height: 600px;
      overflow-y: auto;
      height: auto;
      color: white;
      .boxCard {
        margin: 1%;
        /deep/.el-card {
          background: #303030 !important;
          color: #fff !important;
        }
        .cardItem {
          margin-bottom: 10px;
        }
      }
      li {
        border-bottom: 1px solid white;
        padding: 10px 0px;
@@ -1719,8 +1835,6 @@
  .panerPage {
    width: 100%;
    padding: 5px 0px;
    bottom: 10px;
    position: absolute;
    display: flex;
    justify-content: center;
  }
@@ -1828,7 +1942,7 @@
}
.contentBox {
  height: 550px;
  height: 60vh;
  overflow: auto;
  color: white;
}