Merge branch 'master' of http://192.168.20.92:8888/r/PM20230220027_Web

Surpriseplus

2023-09-11 1a6bf39a0746398c12df9788be90d177aef646bd

Merge branch 'master' of http://192.168.20.92:8888/r/PM20230220027_Web

 package.json

@@ -15,6 +15,7 @@
    "amfe-flexible": "^2.2.1",
    "axios": "^1.3.4",
    "default-passive-events": "^2.0.0",
    "echarts": "^5.4.3",
    "element-plus": "^2.3.0",
    "jquery": "^3.7.1",
    "js-base64": "^3.7.5",

 src/components/BarGraph.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,116 @@
<template>
  <div id="myEcharts" :style="{ width: width, height: height }"></div>
</template>
<script lang="ts" setup>
import {
  ref,
  onMounted,
  onBeforeUnmount,
  reactive,
  defineProps,
  defineEmits,
  watch,
  onUnmounted,
} from "vue";
import * as echarts from "echarts";

//defineProps æ¥æŽ¥æ”¶ç»„件的传值
const props = defineProps({
  width: String,
  height: String,
});
let myEcharts = echarts;
onMounted(() => {
  initChart();
});

onUnmounted(() => {
  myEcharts.dispose;
});

function initChart() {
  let chart = myEcharts.init(
    document.getElementById("myEcharts"),
    "purple-passion"
  );
  chart.setOption({
    title: {
      text: "",
      left: "center",
    },
    legend: {
      data: [],
    },
    xAxis: {
      type: "category",
      data: [
        "一月",
        "二月",
        "三月",
        "四月",
        "五月",
        "六月",
        "七月",
        "八月",
        "九月",
        "十月",
        "十一月",
        "十二月",
      ],
      show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´çº¿ã€åæ ‡è½´åˆ»åº¦çº¿å’Œåæ ‡è½´ä¸Šçš„文字
      axisTick: {
        show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´åˆ»åº¦çº¿
      },
      axisLine: {
        show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´çº¿
      },
      axisLabel: {
        show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´ä¸Šçš„文字
      },
      splitLine: {
        show: false, // ä¸æ˜¾ç¤ºç½‘格线
      },
    },
    tooltip: {
      trigger: "axis",
    },
    yAxis: {
      type: "value",
      show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´çº¿ã€åæ ‡è½´åˆ»åº¦çº¿å’Œåæ ‡è½´ä¸Šçš„文字
      axisTick: {
        show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´åˆ»åº¦çº¿
      },
      axisLine: {
        show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´çº¿
      },
      axisLabel: {
        show: false, // ä¸æ˜¾ç¤ºåæ ‡è½´ä¸Šçš„文字
      },
      splitLine: {
        show: false, // ä¸æ˜¾ç¤ºç½‘格线
      },
    },
    series: [
      {
        data: [606, 542, 985, 687, 501, 787, 339, 706, 383, 684, 669, 737],
        type: "line",
        smooth: true,
        symbol: "none", //取消折点圆圈
        itemStyle: {
          normal: {
            label: {
              show: false,
              position: "top",
              formatter: "{c}",
            },
          },
        },
      },
    ],
  });
  window.onresize = function () {
    chart.resize();
  };
}
</script>
<style lang="less" scoped></style>

 src/views/login.vue

@@ -64,7 +64,9 @@
            />
          </el-form-item>
          <el-form-item prop="verify">
            <div style="display: flex; justify-content: space-between; width: 100%">
            <div
              style="display: flex; justify-content: space-between; width: 100%"
            >
              <el-input
                placeholder="请输入验证码（忽略大小写）"
                v-model="ruleForm.verify"
@@ -78,7 +80,8 @@
              type="primary"
              class="nobr loginbtn btnbox"
              @click="submitForm(ruleFormRef)"
            >登录</el-button>
              >登录</el-button
            >
          </el-form-item>
        </el-form>
      </div>
@@ -93,6 +96,7 @@
  reactive,
  defineProps,
  defineEmits,
  onUnmounted,
} from "vue";
// import config from "../../public/config/config.js";
//Router
@@ -184,12 +188,22 @@
    }
  });
};
const keyDown = (e) => {
  //如果是回车则执行登录方法
  if (e.keyCode == 13) {
    submitForm(ruleFormRef.value);
  }
};
onMounted(() => {
  removeToken();
  //显示月球页面
  startURL();
  //
  getPublicKey();
  window.addEventListener("keydown", keyDown);
});
onUnmounted(() => {
  window.removeEventListener("keydown", keyDown, false);
});
</script>
<style lang="less" scoped>

 src/views/plotting/plottingInquire.vue

@@ -24,7 +24,10 @@
        >
          <!-- <el-tab-pane label="图层属性" name="first">User</el-tab-pane> -->
          <el-tab-pane label="查询结果" name="second">
            <div class="inquireContent_input">
            <div class="chart_box" v-if="chartIsshow">
              <Bar-graph :width="'100%'" :height="'260px'"></Bar-graph>
            </div>
            <div class="inquireContent_input" v-if="!chartIsshow">
              <div class="inquireContent_input_left">
                <div class="label">范围框</div>
                <el-input
@@ -52,7 +55,7 @@
                </el-select>
              </div>
            </div>
            <div class="inquireContent_msg">
            <div class="inquireContent_msg" v-if="!chartIsshow">
              <div class="inquireContent_msg_k">
                <span>提取的边界框</span>
                <span>{{ ScopeBox.pixel }}</span>
@@ -65,7 +68,7 @@
                >
              </div>
            </div>
            <div class="inquireContent_table">
            <div class="inquireContent_table" v-if="!chartIsshow">
              <div class="table">
                <div class="table_head">
                  <div class="table_head_td">序号</div>
@@ -111,6 +114,8 @@
  watch,
} from "vue";
import { useStore } from "vuex"; // å¼•å…¥useStore æ–¹æ³•
//echarts
import BarGraph from "@/components/BarGraph.vue";
const store = useStore(); // è¯¥æ–¹æ³•ç”¨äºŽè¿”回store å®žä¾‹
const emits = defineEmits(["setCloseplotting"]);
let isShow = ref(false);
@@ -198,11 +203,15 @@
//   const setCloseplotting = () => {
//     emits("setCloseplotting", false);
//   };
let chartIsshow = ref(false);
watch(
  () => store.state.plottingInquireData,
  (nVal, oVal) => {
    isShow.value = nVal.isshow;
    inquireData.value = nVal.entitiesData;
    if (nVal.entitiesData.icon == "x.png") {
      chartIsshow.value = true;
    }
  },
  { deep: true }
);