数据发布页面添加

Surpriseplus

2023-03-14 d0405cc50cab4c389d3203428408ecf15b5a0409

数据发布页面添加

 src/assets/lang/en.js

@@ -116,8 +116,12 @@
      inspectionItems: "Inspection items",
      code: 'Code'
    },

    metadataManage: 'information management',
    uploadManage: 'Release management',
    uploadObj: {
      dataRelease: 'Data release',
      releaseList: 'Release list'
    },
    dataLoading: 'dataLoading',
    SpatialData: 'SpatialData',
    versionManage: 'versionManage',

 src/assets/lang/zh.js

@@ -118,6 +118,13 @@
      code: '编码'
    },
    metadataManage: '信息管理',

    uploadManage: '发布管理',
    uploadObj: {
      dataRelease: '数据发布',
      releaseList: '发布清单'
    },

    dataLoading: '数据入库',
    SpatialData: '空间数据管理',
    versionManage: '版本管理',

 src/views/Synthesis/LeftMenu.vue

@@ -90,10 +90,11 @@
            >

              <el-form-item :label="$t('common.name')">
                <el-input v-model="formInline.name"></el-input>
                <!-- <el-input v-model="formInline.name"></el-input> -->
                {{formInline.name}}
              </el-form-item>
              <el-form-item :label="$t('common.type')">
                <el-select
                <!-- <el-select
                  v-model="formInline.type"
                  style="width:100%"
                >
@@ -104,13 +105,15 @@
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
                </el-select> -->
                {{formInline.type}}
              </el-form-item>

              <el-form-item :label="$t('common.bak')">
                <el-input v-model="formInline.bak"></el-input>
                <!-- <el-input v-model="formInline.bak"></el-input> -->
                {{formInline.bak}}
              </el-form-item>
              <el-form-item>
              <!-- <el-form-item>
                <el-button
                  v-show="isShowModel"
                  type="success"
@@ -119,14 +122,14 @@
                  @click="InsertData"
                >{{$t('common.increase')}}</el-button>
                <el-button
                  v-show="!isShowModel"
                  v-show=" isShowModel"
                  type="info"
                  plain
                  size="small"
                  @click="EditData"
                >{{$t('common.update')}}</el-button>
              </el-form-item>
              </el-form-item>
              </el-form-item> -->

            </el-form>

          </el-tab-pane>
@@ -134,6 +137,7 @@
            label="附件"
            name="second"
          >

            <el-table
              :data="tableData"
              ref="filterTable"

 src/views/datamanage/bankController.vue

@@ -22,17 +22,18 @@
      </div>
      <div class="mid box_div">
        <data-updata v-if="setMenuFlag == 'dataUpdata'"></data-updata>
        <!-- <catalogue-manage v-if="setMenuFlag == 'catalogueManage'"></catalogue-manage> -->

        <spatial-data v-if="setMenuFlag == 'SpatialData'"></spatial-data>
        <!-- <version-manage v-if="setMenuFlag == 'versionManage'"></version-manage> -->

        <domain-manage v-if="setMenuFlag == 'domainManage'"></domain-manage>
        <dictionary-manage v-if="setMenuFlag == 'dictionaryManage'"></dictionary-manage>
        <metadata-manage v-if="setMenuFlag == 'metadataManage'"></metadata-manage>
        <style-manage v-if="setMenuFlag == 'styleManage'"></style-manage>
        <data-loader v-if="setMenuFlag == 'dataLoader'"></data-loader>
        <down-loader v-if="setMenuFlag == 'downLoader'"></down-loader>
        <!-- <project-manage v-if="setMenuFlag == 'projectManage'"></project-manage> -->

        <data-statistics v-if="setMenuFlag == 'dataStatistics'"></data-statistics>
        <uploadmanage v-if="setMenuFlag == 'uploadmanage'"></uploadmanage>
      </div>
    </div>

@@ -55,7 +56,8 @@
import downLoader from '@/views/datamanage/downLoader.vue'; //数据管理-数据下载
import projectManage from '@/views/datamanage/projectManage.vue'; //项目管理
import dataStatistics from '@/views/datamanage/dataStatistics.vue'; //数据统计

import uploadmanage from '@/views/datamanage/uploadmanage.vue'; //上传管理
import Uploadmanage from './uploadmanage.vue';
export default {
  components: {
    customElMenu,
@@ -71,6 +73,7 @@
    downLoader,
    projectManage,
    dataStatistics,
    uploadmanage,

  },
  data() {

 src/views/datamanage/uploadmanage.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,432 @@
<template>
  <div class="uploads_box">
    <My-bread :list="[
        `${$t('dataManage.dataManage')}`,
        `${$t('dataManage.uploadManage')}`,
      ]"></My-bread>
    <el-divider />
    <!-- tabs切换 -->
    <div class="tabs_box">
      <div
        class="tabs_pane"
        @click="setTabsChange()"
      >
        <div :class="{ changetabs : active == 'first'}">
          {{$t('dataManage.uploadObj.dataRelease')}}
        </div>
      </div>
      <div
        class="tabs_pane"
        @click="setTabsChange()"
      >
        <div :class="{ changetabs : active == 'second'}">
          {{$t('dataManage.uploadObj.releaseList')}}
        </div>
      </div>
    </div>
    <div class="content_box">
      <el-form
        :inline="true"
        :model="formInline"
        class="demo-form-inline"
      >
        <!-- å•ä½ -->
        <el-form-item>
          <el-select
            size="small"
            v-model="formInline.depid"
          >
            <el-option
              :value="formInline.depid"
              :label="formInline.depName"
              style="height: auto"
            >
              <el-tree
                ref="tree"
                :data="depOption"
                node-key="id"
                :props="defaultProps"
                @node-click="handleDepChange"
              />
            </el-option>
          </el-select>
        </el-form-item>
        <!-- ç›®å½• -->
        <el-form-item>
          <el-select
            size="small"
            v-model="formInline.dirid"
          >
            <el-option
              :value="formInline.dirid"
              :label="formInline.dirName"
              style="height: auto"
            >
              <el-tree
                ref="tree"
                :data="dirOption"
                node-key="id"
                :props="defaultProps"
                @node-click="handleDirChange"
              />
            </el-option>
          </el-select>
        </el-form-item>
        <!-- ç‰ˆæœ¬ -->
        <el-form-item>
          <el-select
            size="small"
            v-model="formInline.verid"
            @change="handleVerChange"
          > <el-option
              v-for="item in verOption"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <!-- ç±»åž‹ -->
        <el-form-item>
          <el-select
            size="small"
            v-model="formInline.type"
            @change="handleTypeChange"
          >
            <el-option
              v-for="item in typeOption"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-input
            size="small"
            :title="$t('dataManage.vmobj.keyword')"
          > <i
              @click="getTableData"
              :title="$t('common.iquery')"
              slot="suffix"
              class="el-icon-search"
              style="padding-right: 8px"
            ></i></el-input>
        </el-form-item>
        <el-form-item style="float:right">
          <el-button
            type="info"
            size="small"
            @click="setPageStart"
            icon="el-icon-refresh"
          >{{$t('common.reset')}}</el-button>
        </el-form-item>
      </el-form>

      <div class="dividing-line"></div>
      <div class="table_box content_Table">
        <el-table
          :data="tableData"
          style="width: 100%"
          border
          @selection-change="handleSelectionChange"
          height="calc(100% - 1px)"
        >
          <el-table-column
            type="selection"
            width="55"
          />
          <el-table-column
            :label="$t('dataManage.dictionaryManageObj.number')"
            type="index"
            width="50"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="type"
            :label="$t('dataManage.vmobj.name')"
            align="center"
          />
          <el-table-column
            prop="type"
            :label="$t('dataManage.vmobj.format')"
            align="center"
          />
          <el-table-column
            prop="sizes"
            :label="$t('dataManage.vmobj.size')"
            :formatter="stateFormatSizes"
            align="center"
          />
          <el-table-column
            prop="depName"
            :label="$t('dataManage.vmobj.depName')"
            align="center"
          />
          <el-table-column
            prop="dirName"
            :label="$t('dataManage.vmobj.dirName')"
            width="200"
            align="center"
          />
          <el-table-column
            prop="verName"
            :label="$t('dataManage.vmobj.versionNumber')"
            align="center"
          />
          <el-table-column
            prop="uname"
            :label="$t('dataManage.vmobj.createonuser')"
            align="center"
          />
          <el-table-column
            prop="createTime"
            :label="$t('dataManage.vmobj.createontime')"
            :formatter="formatData"
            align="center"
          />
        </el-table>
      </div>
      <div
        class="pagination_box"
        style="margin-top: 10px"
      >
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="listData.pageIndex"
          :page-sizes="[10, 20, 50, 100]"
          :page-size="listData.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="listData.count"
        >
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>

import MyBread from "../../components/MyBread.vue"
import { selectdepTab, selectdirTab, meta_selectVerByDirid } from '../../api/api.js'
export default {
  components: { MyBread },
  data() {
    return {
      active: 'first',
      formInline: {
        dirid: null,
        dirName: null,
        depid: null,
        verid: null,
        depName: null,
        name: "",
        type: ""
      },
      listData: {
        pageIndex: 1,
        pageSize: 10,
        count: 0
      },
      depOption: [],
      dirOption: [],
      verOption: [],
      typeOption: [{
        value: 't1',
        label: '全部'
      }, {
        value: 't2',
        label: '影像数据(.tif, .img)'
      }, {
        value: 't3',
        label: '场景数据(.mpt)'
      }, {
        value: 't4',
        label: '三维模型(.3dml)'
      }, {
        value: 't5',
        label: '三维模型(.fbx, .ifc, .rvt)'
      }],
      defaultProps: {
        label: "name",
        value: "id",
        children: "children",
        checkStrictly: true,
        emitPath: false,
      },
    }
  },
  methods: {
    //分页切换
    handleCurrentChange(val) {
      this.listData.pageIndex = val;
      this.getTableData();
    },
    //每页显示数量
    handleSizeChange(val) {
      this.listData.pageSize = val;
      this.listData.pageIndex = 1;
      this.getTableData();
    },
    //tabs切換
    setTabsChange() {
      switch (this.active) {
        case 'first':
          this.active = 'second';
          this.setPageStart();
          break;
        case 'second':
          this.active = 'first';
          this.setPageStart();
          break;

      }
    },
    //页面初始化
    setPageStart() {
      this.formInline = {
        dirid: null,
        dirName: null,
        depid: null,
        verid: null,
        depName: null,
        name: "",
        type: ""
      }
      this.listData = {
        pageIndex: 1,
        pageSize: 10,
        count: 0
      }
      this.formInline.type = this.typeOption[0].value;
      this.getDepTreeList();
      this.getDirTreeList();
    },
    //获取目录列表
    async getDirTreeList() {
      const data = await selectdirTab();
      if (data.code != 200) {
        this.$message.error("单位列表获取失败")
        return
      }
      this.dirOption = this.treeData(data.result);
      this.formInline.dirid = this.dirOption[0].id;
      this.formInline.dirName = this.dirOption[0].name;
      this.getVerList()
    },
    //获取版本列表
    async getVerList() {
      const data = await meta_selectVerByDirid({ dirid: this.formInline.dirid })
      if (data.code != 200) {
        this.$message.error("版本列表获取失败")
        return
      }
      this.verOption = data.result
      this.formInline.verid = data.result[0].id;
      this.getTableData();
    },
    //版本列表切换
    handleVerChange(value) {
      this.formInline.verid = value;
      this.getTableData();
    },
    //服务类型列表切换
    handleTypeChange(value) {
      this.formInline.type = value;
      this.getTableData();
    },
    //单位列表切换
    handleDepChange(data, node, nodeData) {
      this.formInline.depid = data.id
      this.formInline.depName = data.name
      this.getTableData();
    },
    //单位列表切换
    handleDirChange(data, node, nodeData) {
      this.formInline.dirid = data.id
      this.formInline.dirName = data.name
      this.getVerList()
    },
    //获取Table表格数据
    getTableData() {

    },
    //获取单位列表
    async getDepTreeList() {
      const data = await selectdepTab();
      if (data.code != 200) {
        this.$message.error("单位列表获取失败")
        return
      }
      this.depOption = this.treeData(data.result);
      this.formInline.depid = this.depOption[0].id
      this.formInline.depName = this.depOption[0].name
    },
    //树列表生成
    treeData(source) {
      let cloneData = JSON.parse(JSON.stringify(source)) // å¯¹æºæ•°æ®æ·±åº¦å…‹éš†
      return cloneData.filter(father => {
        // å¾ªçŽ¯æ‰€æœ‰é¡¹
        let branchArr = cloneData.filter(child => father.id == child.pid) // å¯¹æ¯”ID，分别上下级菜单，并返回数据
        branchArr.length > 0 ? (father.children = branchArr) : "" // ç»™çˆ¶çº§æ·»åŠ ä¸€ä¸ªchildren属性，并赋值
        return father.pid == 0 // è¿”回一级菜单
      })
    },
  },
  mounted() {
    this.active = 'first';
    this.setPageStart();
  }
}
</script>

<style lang="less" scoped>
.uploads_box {
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  padding: 10px;
  .tabs_box {
    width: 100%;
    border-bottom: 2px solid #e4e7ed;
    margin-bottom: 10px;
  }
  .tabs_pane {
    padding: 0 10px;
    height: 40px;
    box-sizing: border-box;
    line-height: 40px;
    display: inline-block;
    list-style: none;
    font-size: 14px;
    font-weight: 500;
    color: #303133;
  }
  .tabs_pane:hover {
    color: #409eff;
  }
  .changetabs {
    color: #409eff;

    border-bottom: 2px solid #409eff;
  }
  .tabs_nav {
    width: 100%;
    height: 2px;
    background: #e4e7ed;
  }
  .content_box {
    width: 100%;
    height: calc(100% - 90px);
    /deep/.el-form-item {
      margin-bottom: 15px;
    }
    .content_Table {
      height: calc(100% - 110px);
    }
  }
}
</style>