月球大数据地理空间分析展示平台-【中台】
Surpriseplus
2023-10-10 7a83906e6714edea1568d10acb4eb0bc1aae81c6
src/views/datamanage/resourceManagement.vue
@@ -24,17 +24,85 @@
            > <i
                :title="$t('common.iquery')"
                slot="suffix"
                @click="setListDataStart"
                @click="getResTableData"
                class="el-icon-search"
                style="padding-right: 8px"
              ></i></el-input>
          </el-form-item>
          <!-- 服务类别 -->
          <el-form-item>
            <el-select
              size="small"
              v-model="formInline.category"
              :placeholder="$t('dataManage.layerObj.prompt18')"
              @change="getResTableData"
            >
              <el-option
                v-for="item in serviceType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <!-- 数据类型 -->
          <el-form-item>
            <el-select
              size="small"
              v-model="formInline.data"
              :placeholder="$t('dataManage.layerObj.prompt8')"
              @change="getResTableData"
            >
              <el-option
                v-for="item in dataType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <!-- 服务类别 -->
          <el-form-item>
            <el-select
              size="small"
              v-model="formInline.type"
              :placeholder="$t('dataManage.layerObj.prompt3')"
              @change="getResTableData"
            >
              <el-option
                v-for="item in dataTypes"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <!-- 状态 -->
          <el-form-item>
            <el-select
              size="small"
              v-model="formInline.status"
              :placeholder="$t('dataManage.layerObj.prompt19')"
              @change="getResTableData"
            >
              <el-option
                v-for="item in statusType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item style="float: right;">
            <el-button
              v-if="menuStatus.insert"
              icon="el-icon-edit"
              type="success"
              @click="insertDialog = true"
              @click="setInsertTableData"
              size="small"
            >{{ $t('common.append') }}
            </el-button>
@@ -108,8 +176,15 @@
          <el-table-column
            align="center"
            prop="type"
            :label="$t('dataManage.layerObj.dataType')"
            :label="$t('dataManage.layerObj.serviceType')"
            :formatter="setResType"
            width="150"
          />
          <el-table-column
            align="center"
            prop="data"
            :label="$t('dataManage.layerObj.dataType')"
            :formatter="setResData"
            width="150"
          />
          <el-table-column
@@ -183,7 +258,7 @@
          />
          <el-table-column
            :label="$t('common.operate')"
            width="150"
            width="200"
          >
            <template slot-scope="scope">
              <el-button
@@ -192,6 +267,12 @@
                type="warning"
                plain
              >{{ $t('common.update') }}</el-button>
              <el-button
                size="small"
                v-show="scope.row.status != 0"
                plain
                @click="setScopePreview(scope.row)"
              >{{ $t('common.preview') }}</el-button>
            </template>
          </el-table-column>
@@ -233,13 +314,7 @@
              class="insertWidth"
            ></el-input>
          </el-form-item>
          <!-- <el-form-item :label="$t('dataManage.layerObj.englishName')">
            <el-input
              v-model="insertData.enName"
              :placeholder="$t('dataManage.layerObj.prompt14')"
              class="insertWidth"
            ></el-input>
          </el-form-item> -->
          <el-form-item :label="$t('dataManage.layerObj.firm')">
            <el-select
              class="insertWidth"
@@ -258,8 +333,9 @@
          <el-form-item :label="$t('dataManage.layerObj.dataType')">
            <el-select
              class="insertWidth"
              v-model="insertData.type"
              :placeholder="$t('dataManage.layerObj.prompt8')"
              v-model="insertData.data"
              @change="setCategoryTypeChange"
              :placeholder="$t('dataManage.layerObj.prompt3')"
            >
              <el-option
                v-for="item in dataType"
@@ -271,11 +347,30 @@
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('dataManage.layerObj.tableName')">
          <el-form-item :label="$t('dataManage.layerObj.serviceType')">
            <el-select
              class="insertWidth"
              v-model="insertData.type"
              :placeholder="$t('dataManage.layerObj.prompt8')"
            >
              <el-option
                v-for="item in categoryType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="insertData.category == 2"
            :label="$t('dataManage.layerObj.layerName')"
          >
            <el-input
              v-model="insertData.tab"
              class="insertWidth"
              :placeholder="$t('dataManage.layerObj.prompt12')"
              :placeholder="$t('dataManage.layerObj.prompt1')"
            ></el-input>
          </el-form-item>
          <el-form-item :label="$t('dataManage.layerObj.serviceAddress')">
@@ -392,11 +487,27 @@
          <el-form-item :label="$t('dataManage.layerObj.dataType')">
            <el-select
              class="insertWidth"
              v-model="editData.data"
              @change="setEdtitTypeChange"
              :placeholder="$t('dataManage.layerObj.prompt3')"
            >
              <el-option
                v-for="item in dataType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('dataManage.layerObj.serviceType')">
            <el-select
              class="insertWidth"
              v-model="editData.type"
              :placeholder="$t('dataManage.layerObj.prompt8')"
            >
              <el-option
                v-for="item in dataType"
                v-for="item in categoryType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
@@ -482,10 +593,37 @@
        </span>
      </div>
    </el-dialog>
    <!-- 地址预览 -->
    <el-dialog
      :title="$t('common.preview')"
      :class="isFullscreen ? '' : 'dialogClass_his'"
      custom-class="handleDialogClass"
      width="73.4%"
      :fullscreen="isFullscreen"
      v-if="prevDialog"
      :visible.sync="prevDialog"
      :show-close="false"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <dialog-header
        slot="title"
        :dialog-tittle="$t('common.preview')"
        :fullscreen="isFullscreen"
        @handle-closed="handleClose"
        @is-fullscreen="onFullscreen"
      ></dialog-header>
      <div :class="{'fullscreen1':isFullscreen}">
        <mapview v-if="showMapView"></mapview>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import MyBread from "../../components/MyBread.vue";
import dialogHeader from './dialogHeader.vue'
import server from '../../components/js/server.js'
import {
  getPerms,
  select_Res_ByPageAndCount,
@@ -493,23 +631,28 @@
  res_deletes,
  res_updates,
  res_update,
  token_insertNewToken
} from "../../api/api";
import $ from 'jquery'
import { getToken } from '../../utils/auth';
import { serve_type, data_type } from './js/layerManage.js'
import { serve_type, data_type, category_type } from './js/layerManage.js'
import { json } from "body-parser";
import { flatten } from '@turf/turf';
import mapview from '../../components/MapView/moonMap.vue'
export default {
  name: "catalogueManage",
  components: {
    MyBread,
    MyBread, mapview, 'dialog-header': dialogHeader,
  },
  data() {
    return {
      formInline: {
        name: null
        name: null,
        type: null,
        data: null,
        category: null,
        status: null
      },
      menuStatus: {
        delete: false,
@@ -531,12 +674,32 @@
      editData: {},
      copyData: null,
      insertData: {
        status: "2"
        status: "2",
        category: null,
        type: null,
        data: null
      },
      editDialog: false,
      insertDialog: false,
      dataType: [],
      serviceType: []
      dataTypes: [],
      serviceType: [],
      categoryType: [],
      insertDisabled: false,
      editDisabled: false,
      isFullscreen: false,
      prevDialog: false,
      showMapView: false,
      statusType: [
        {
          label: '禁用', value: 0
        },
        {
          label: '启用原始地址', value: 1
        }, {
          label: '启用代理地址', value: 2
        }
      ], resToken: null,
    };
  },
  watch: {
@@ -547,7 +710,37 @@
    window.removeEventListener("resize", this.onResize);
  },
  methods: {
    async getResToken() {
      if (this.$store.state.resToken) {
        this.resToken = this.$store.state.resToken
      } else {
        const data = await token_insertNewToken({
          type: 1,
          min: 43200
        });
        if (data.code == 200) {
          this.$store.state.resToken = data.result.token;
          this.resToken = data.result.token;
        }
      }
    },
    //是否为全屏函数
    onFullscreen(fullscreen) {
      this.isFullscreen = fullscreen;
    },
    //预览弹窗关闭
    handleClose() {
      this.prevDialog = false
      this.showMapView = false;
    },
    async setEditConfirm() {
      if (this.editData.url.indexOf('?') > -1) {
        var val = this.editData.url.split("?");
        this.editData.url = val[0];
        this.editData.args = this.editData.args + val[1];
      }
      const data = await res_update(this.editData);
      if (data.code == 200) {
        this.$message({
@@ -578,9 +771,73 @@
        .catch(_ => { });
    },
    setEmptyData() {
      this.formInline.name = ""
      this.formInline = {
        name: null,
        type: null,
        data: null,
        category: null,
        status: null
      }
      this.setListDataStart()
    },
    setInsertTableData() {
      this.insertData.category = this.serviceType[0].value
      this.insertData.data = this.dataType[0].value
      this.setServeTypeChange(this.dataType[0].children)
      this.insertDialog = true;
    },
    setServeTypeChange(res) {
      var std = [];
      for (var i in res) {
        for (var j in serve_type) {
          if (serve_type[j].value == res[i]) {
            std.push({
              value: serve_type[j].value,
              label: serve_type[j].name,
            })
          }
        }
      }
      this.categoryType = std
      this.insertData.type = this.categoryType[0].value
    },
    setCategoryTypeChange(item) {
      var filter = this.dataType.filter(res => {
        if (res.value == item) {
          return res
        }
      })
      this.setServeTypeChange(filter[0].children)
    },
    setEdtitTypeChange(item) {
      var filter = this.dataType.filter(res => {
        if (res.value == item) {
          return res
        }
      })
      this.setEditServeTypeChange(filter[0].children)
    },
    setEditServeTypeChange(res) {
      var std = [];
      for (var i in res) {
        for (var j in serve_type) {
          if (serve_type[j].value == res[i]) {
            std.push({
              value: serve_type[j].value,
              label: serve_type[j].name,
            })
          }
        }
      }
      this.categoryType = std
      this.editData.type = this.categoryType[0].value
    },
    async setDelTableData() {
      if (this.multipleSelection.length <= 0) {
        return this.$message('请选择要删除的资源数据');
@@ -615,6 +872,13 @@
        .catch(_ => { });
    },
    async setInsertConfirm() {
      if (this.insertData.url.indexOf('?') > -1) {
        var val = this.insertData.url.split("?");
        this.insertData.url = val[0];
        this.insertData.args = val[1] + this.insertData.args;
      }
      this.insertData.status = parseInt(this.insertData.status)
      const data = await res_insert(this.insertData);
      if (data.code == 200) {
        this.$message({
@@ -633,31 +897,55 @@
    optionsStart() {
      var std = [];
      var ste = [];
      for (var i in serve_type) {
      var str = [];
      for (var i in category_type) {
        ste.push({
          value: category_type[i].value,
          label: category_type[i].name,
        })
      }
      this.serviceType = ste;
      for (var i in data_type) {
        str.push({
          value: data_type[i].value,
          label: data_type[i].name,
          children: data_type[i].children
        })
      }
      this.dataType = str;
      for (var i in serve_type) {
        std.push({
          value: serve_type[i].value,
          label: serve_type[i].name,
        })
      }
      this.serviceType = std;
      for (var i in data_type) {
        std.push({
          value: data_type[i].value,
          label: data_type[i].name,
        })
      }
      this.dataType = ste;
      this.dataTypes = std;
    },
    setScopeEdit(row) {
      this.copyData = JSON.parse(JSON.stringify(row));
      this.editData = JSON.parse(JSON.stringify(row));
      this.editData.status = this.editData.status.toString()
      this.editData.category = parseInt(this.editData.category)
      this.editData.type = parseInt(this.editData.type)
      if (this.editData.data) {
        this.editData.data = parseInt(this.editData.data)
      }
      this.editDialog = true
    },
    setScopePreview(row) {
      this.prevDialog = true;
      this.showMapView = true;
      setTimeout(() => {
        server.addLayer(row)
      }, 1000);
    },
    formatProxy(row, column) {
      var token = getToken()
      var val = row.proxy.replaceAll('{token}', token)
      return BASE_URL + val
      var token = this.resToken
      if (row.proxy && row.proxy.indexOf('{token}') > -1) {
        var val = row.proxy.replaceAll('{token}', token)
        return BASE_URL + val
      }
    },
    copyText(row, column, cell, event) {
      // 双击复制
@@ -731,6 +1019,37 @@
          break;
      }
    },
    setResData(row, column) {
      switch (row.data) {
        case 1:
          return "数字正射影像图"
          break;
        case 2:
          return "场景地形数据"
          break;
        case 3:
          return "数字高程模型(晕渲图)"
          break;
        case 4:
          return "单波段栅格数据"
          break;
        case 5:
          return "多光谱栅格数据"
          break;
        case 6:
          return "高光谱栅格数据"
          break;
        case 7:
          return "矢量图层"
          break;
        case 8:
          return "三维模型"
          break;
        default:
          return ""
          break;
      }
    },
    setResCategory(row, column) {
      switch (row.category) {
        case 0:
@@ -768,7 +1087,11 @@
      }
    },
    async getResTableData() {
      this.listData.name = this.formInline.name
      this.listData.name = this.formInline.name;
      this.listData.data = this.formInline.data;
      this.listData.type = this.formInline.type;
      this.listData.category = this.formInline.category;
      this.listData.status = this.formInline.status;
      const data = await select_Res_ByPageAndCount(this.listData);
      if (data.code != 200) {
        return this.$message({
@@ -849,10 +1172,12 @@
  },
  mounted() {
    window.addEventListener("resize", this.onResize);
    this.getResToken();
    this.calHeight();
    this.getPerms();
    this.setListDataStart();
    this.optionsStart();
  },
};
@@ -880,6 +1205,10 @@
    }
  }
}
.fullscreen1 {
  width: 100%;
  height: 94vh;
}
/deep/ .el-input__suffix {
  top: 50%;
  transform: translateY(-50%);
@@ -887,6 +1216,12 @@
.insertWidth {
  width: calc(100% - 200px);
}
/deep/.el-dialog__body {
  padding: 10px !important;
}
/deep/.el-dialog__header {
  padding: 10px !important;
}
</style>
<style >
.el-message-box {