管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2023-03-18 35889caf6315da8f72aec921069547af462b479a
src/views/datamanage/uploadmanage.vue
@@ -1,5 +1,6 @@
<template>
  <div class="uploads_box">
    <My-bread :list="[
        `${$t('dataManage.dataManage')}`,
        `${$t('dataManage.uploadManage')}`,
@@ -113,6 +114,7 @@
          <el-input
            size="small"
            :title="$t('dataManage.vmobj.keyword')"
            v-model="formInline.name"
          > <i
              @click="getTableData"
              :title="$t('common.iquery')"
@@ -124,12 +126,15 @@
        <el-form-item style="float:right">
          <!-- 发布 -->
          <el-button
            v-if="active == 'first'"
            type="success"
            size="small"
            icon="el-icon-s-promotion"
            @click="setPagePublish"
          >{{$t('common.publish')}}</el-button>
          <!-- 刪除 -->
          <el-button
            v-if="active == 'second'"
            type="danger"
            size="small"
            icon="el-icon-delete"
@@ -166,7 +171,7 @@
          >
          </el-table-column>
          <el-table-column
            prop="type"
            prop="name"
            :label="$t('dataManage.vmobj.name')"
            align="center"
          />
@@ -229,27 +234,28 @@
          >
            <template slot-scope="scope">
              <el-button
                v-if="scope.row.url"
                v-if="active == 'second'"
                size="small"
                type="success"
                type="info"
                plain
                @click="setPreviewLayer(scope.row)"
              >{{$t('common.preview')}}
                @click="setPreviewDetails(scope.row)"
              >{{$t('common.details')}}
              </el-button>
              <el-button
                v-if="scope.row.url"
                v-if="active == 'second'"
                size="small"
                type="warning"
                plain
                @click="setPreviewLayer(scope.row)"
              >{{$t('common.preview')}}
                @click="setPreviewEdit(scope.row)"
              >{{$t('common.update')}}
              </el-button>
              <el-button
                v-if="scope.row.url"
                size="small"
                type="info"
                type="success"
                plain
                @click="setPreviewLayer(scope.row)"
              >{{$t('common.preview')}}
@@ -287,8 +293,172 @@
        <mapview v-if="showMapView"></mapview>
      </div>
    </el-dialog>
    <!-- 修改数据 -->
    <el-dialog
      :title="$t('common.update')"
      :visible.sync="editDialogVisible"
      width="50%"
      :show-close="false"
      :close-on-click-modal="false"
    >
      <div style="width:100%;height:50vh">
        <el-form
          ref="form"
          :model="editLayer"
          label-width="150px"
        >
          <el-form-item :label="$t('dataManage.vmobj.name')">
            <el-input v-model="editLayer.name"></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.format')">
            <el-input
              disabled
              v-model="editLayer.type"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.depName')">
            <el-input
              disabled
              v-model="editLayer.depName"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.dirName')">
            <el-input
              disabled
              v-model="editLayer.dirName"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.versionNumber')">
            <el-input
              disabled
              v-model="editLayer.verName"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('common.publishAddress')">
            <el-input v-model="editLayer.url"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              size="small"
              type="primary"
              @click="setEditLayerSubmit"
            >{{$t('common.submit')}}</el-button>
            <el-button
              size="small"
              type="info"
              @click="setEditLayerCancle"
            >{{$t('common.cancel')}}</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
    <!-- 数据详情 -->
    <el-dialog
      :title="$t('common.details')"
      :visible.sync="detailsDialogVisible"
      width="50%"
      :close-on-click-modal="false"
    >
      <div style="width:100%;height:50vh">
        <p>{{ $t("dataManage.vmobj.name") }}:{{ itemdetail.name }}</p>
        <el-divider></el-divider>
        <p>{{ $t("dataManage.vmobj.format") }}:{{ itemdetail.type }}</p>
        <el-divider></el-divider>
        <p>{{ $t("dataManage.vmobj.depName") }}:{{ itemdetail.depName }}</p>
        <el-divider></el-divider>
        <p>{{ $t("dataManage.vmobj.dirName") }}:{{ itemdetail.dirName }}</p>
        <el-divider></el-divider>
        <p>{{ $t("dataManage.vmobj.versionNumber") }}:{{ itemdetail.verName }}</p>
        <el-divider></el-divider>
        <p>{{ $t("common.publishAddress") }}:{{ itemdetail.url }}</p>
        <el-divider></el-divider>
        <p>{{ $t("common.rublisher") }}:{{ itemdetail.createName }}</p>
        <el-divider></el-divider>
        <p>{{ $t("common.releaseTime") }}:{{ itemdetail.createTime }}</p>
        <el-divider></el-divider>
        <p>{{ $t("dataManage.vmobj.updateonuser") }}:{{ itemdetail.updateName }}</p>
        <el-divider></el-divider>
        <p>{{ $t("dataManage.vmobj.updateontime") }}:{{ itemdetail.updateTime }}</p>
        <el-divider></el-divider>
      </div>
    </el-dialog>
    <!-- 发布 -->
    <el-dialog
      :title="$t('common.publish')"
      :visible.sync="insertDialogVisible"
      width="40%"
      :close-on-click-modal="false"
    >
      <div style="width:100%;height:30vh">
        <el-form
          ref="form"
          :model="insertLayer"
          label-width="150px"
        >
          <el-form-item :label="$t('dataManage.vmobj.name')">
            <el-input
              v-model="insertLayer.name"
              :placeholder="$t('dataManage.vmobj.name')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.numberFiles')">
            <el-input
              disabled
              v-model="insertLayer.number"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.minLevel')">
            <el-input
              v-model="insertLayer.min"
              :placeholder="$t('dataManage.vmobj.labe11')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.vmobj.maxLevel')">
            <el-input
              v-model="insertLayer.max"
              :placeholder="$t('dataManage.vmobj.labe12')"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              size="small"
              type="primary"
              @click="setinsertLayerSubmit()"
            >{{$t('common.submit')}}</el-button>
            <el-button
              size="small"
              type="info"
              @click="setsubmitLayerSubmit()"
            >{{$t('common.cancel')}}</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
    <div
      class="loadBox"
      v-if="loadDialogVisible"
    >
      <div style="widht:100%; margin:20px; color:white">
        <div style="margin-left:99%">
          <el-link
            @click="setloadDialogVisible()"
            style="color:white"
          > X</el-link>
        </div>
      </div>
      <div
        v-loading="true"
        element-loading-background="rgba(0, 0, 0, 0.0) "
        element-loading-text="数据发布中"
        style="margin: 0px 20px;widht:100%;height:calc(100% - 80px); "
      >
      </div>
    </div>
  </div>
</template>
<script>
@@ -300,7 +470,9 @@
  meta_selectVerByDirid,
  publish_selectMetasByPage,
  publish_selectByPage,
  publish_deletes
  publish_deletes,
  publish_update,
  publish_insert,
} from '../../api/api.js'
export default {
@@ -350,10 +522,162 @@
      dialogVisible: false,
      showMapView: false,
      showPageSize: [],
      editLayer: {},
      updateLayer: {},
      editDialogVisible: false,
      detailsDialogVisible: false,
      itemdetail: {},
      insertDialogVisible: false,
      insertLayer: { name: '', number: null, min: 4, max: 8 },
      loadDialogVisible: false
    }
  },
  methods: {
    setloadDialogVisible() {
      this.loadDialogVisible = false
    },
    //发布提交
    async setinsertLayerSubmit() {
      var min = this.insertLayer.min;
      var max = this.insertLayer.max;
      var name = this.insertLayer.name;
      if (!name) {
        this.$message.error("名称不能为空")
        return
      }
      if (!min) {
        this.$message.error("请输入最小级别(0 ~ 20)")
        return
      } else {
        if (parseInt(min) < 0 || parseInt(min) > 20) {
          this.$message.error(" 最小级别不能小于 0 或大于 20 ")
          return
        }
      }
      if (!max) {
        this.$message.error("请输入最大级别(0 ~ 20)")
        return
      } else {
        if (parseInt(max) < 0 || parseInt(max) > 20) {
          this.$message.error(" 最大级别不能小于 0 或大于 20 ")
          return
        }
      }
      if (parseInt(min) > parseInt(max)) {
        this.$message.error("最小级别不得大于最大级别")
        return
      }
      var std = [];
      for (var i in this.multipleSelection) {
        std.push(this.multipleSelection[i])
      }
      var obj = {
        dircode: this.formInline.dirid,
        depcode: this.formInline.depid,
        min: min,
        max: max,
        name: name,
        ids: std.toString(),
        type: this.formInline.type
      }
      this.loadDialogVisible = true
      this.insertDialogVisible = false;
      const data = await publish_insert(obj);
      if (data.code != 200) {
        this.$message.error("数据发布失败")
      } else {
        this.$message({
          message: '数据发布成功',
          type: 'success'
        });
      }
      this.loadDialogVisible = false
      this.getTableData();
    },
    //数据发布
    async setPagePublish() {
      if (this.multipleSelection.length == 0) {
        this.$message.error("请选择要发布的数据")
        return
      }
      if (this.formInline.type == "DOM") {
        this.insertLayer.name = this.formInline.dirName;
        this.insertLayer.number = this.multipleSelection.length
        this.insertDialogVisible = true;
      } else {
        var std = [];
        for (var i in this.multipleSelection) {
          std.push(this.multipleSelection[i])
        }
        var obj = {
          dircode: this.formInline.dirid,
          depcode: this.formInline.depid,
          ids: std.toString(),
          type: this.formInline.type
        }
        this.loadDialogVisible = true
        this.insertDialogVisible = false;
        const data = await publish_insert(obj);
        if (data.code != 200) {
          this.$message.error("数据发布失败")
        } else {
          this.$message({
            message: '数据发布成功',
            type: 'success'
          });
        }
        this.loadDialogVisible = false
        this.getTableData();
      }
    },
    //数据详情
    setPreviewDetails(res) {
      this.itemdetail = res;
      this.detailsDialogVisible = true;
    },
    //修改提交
    async setEditLayerSubmit() {
      const data = await publish_update(this.editLayer);
      if (data.code != 200) {
        this.$message.error("数据修改失败")
        return
      }
      this.$message({
        message: '数据修改成功',
        type: 'success'
      });
      this.getTableData();
      this.editDialogVisible = false;
    },
    //修改取消
    setEditLayerCancle() {
      if (this.editLayer == this.updateLayer) {
        this.editDialogVisible = false;
      } else {
        this.$confirm('确认关闭?')
          .then(_ => {
            done();
          })
          .catch(_ => {
            this.editLayer = JSON.parse(this.updateLayer)
            this.editDialogVisible = false;
          });
      }
    },
    //修改弹窗
    setPreviewEdit(res) {
      this.updateLayer = JSON.stringify(res) //备份;
      this.editLayer = JSON.parse(JSON.stringify(res));
      this.editDialogVisible = true;
    },
    //删除
    async setPageDelete() {
      if (this.multipleSelection.length == 0) {
        return this.$message.error("请选择要删除的数据")
@@ -362,7 +686,7 @@
        for (var i in this.multipleSelection) {
          std.push(this.multipleSelection[i].id);
        }
        const data = await publish_deletes(std);
        const data = await publish_deletes({ ids: std.toString() });
        if (data.code != 200) {
          this.$message.error("单位列表获取失败")
          return
@@ -484,11 +808,11 @@
      this.dirOption = this.treeData(data.result);
      this.formInline.dirid = this.dirOption[0].code;
      this.formInline.dirName = this.dirOption[0].name;
      this.getVerList()
      this.getVerList(this.dirOption[0].id)
    },
    //获取版本列表
    async getVerList() {
      const data = await meta_selectVerByDirid({ dirid: this.formInline.dirid })
    async getVerList(res) {
      const data = await meta_selectVerByDirid({ dirid: res })
      if (data.code != 200) {
        this.$message.error("版本列表获取失败")
        return
@@ -499,6 +823,7 @@
    },
    //版本列表切换
    handleVerChange(value) {
      debugger
      this.formInline.verid = value;
      this.getTableData();
    },
@@ -515,10 +840,9 @@
    },
    //目录列表切换
    handleDirChange(data, node, nodeData) {
      this.formInline.dirid = data.code
      this.formInline.dirName = data.name
      this.getVerList()
      this.getVerList(data.id)
    },
    //获取Table表格数据
    async getTableData() {
@@ -567,7 +891,9 @@
            if (res.createTime) {
              res.createTime = that.format(res.createTime);
            }
            if (res.updateTime) {
              res.updateTime = that.format(res.updateTime);
            }
            if (res.url) {
              res.url = res.url.replace("{host}", iisHost);
            }
@@ -679,5 +1005,20 @@
      height: calc(100% - 110px);
    }
  }
  /deep/.el-divider--horizontal {
    margin: 14px 0px;
  }
  .loadBox {
    position: fixed;
    z-index: 2002;
    background: rgba(0, 0, 0, 0.2);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    .el-loading-mask {
      background: transparent !important;
    }
  }
}
</style>