功能优化

艺术家

2025-05-22 52756e8a22ff5d3c5e9cf90dfa5b87742c60350d

 ÏîÄ¿´úÂë/ÉìËõ¸Ë/client/src/views/tts/PickAndDrop/Manualcontrol.vue

@@ -1,6 +1,104 @@
<template>
  <div class="Manualcontrol">
    <div class="button">
      <div class="button_l">
        <el-button
          @click="handleAutoPickAndDrop('伸出')"
          type="primary"
          size="small"
          style="
            width: 14.69rem;
            height: 5.06rem;
            color: rgba(64, 253, 240, 1);
            background-color: rgba(6, 229, 231, 0.3);
            border: none;
            border-top: 0.25rem solid rgba(6, 229, 231, 1);
          "
        >
          <div class="btnicon">
            <span
              style="
                width: 1rem;
                height: 1rem;
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: 50% 50%;
                border: 0.1rem solid rgb(0, 0, 0);
                color: rgb(0, 0, 0);
                font-size: 0.75rem;
                margin-left: 0.1rem;
              "
              >i</span
            >
          </div>
          <span style="font-size: 2.25rem; text-align: center">定位伸按钮</span>
        </el-button>
        <el-button
          @click="handleAutoPickAndDrop('缩回')"
          type="primary"
          size="small"
          style="
            width: 14.69rem;
            height: 5.06rem;
            color: rgba(64, 253, 240, 1);
            background-color: rgba(6, 229, 231, 0.3);
            border: none;
            border-top: 0.25rem solid rgba(6, 229, 231, 1);
          "
        >
          <div class="btnicon">
            <span
              style="
                width: 1rem;
                height: 1rem;
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: 50% 50%;
                border: 0.1rem solid rgb(0, 0, 0);
                color: rgb(0, 0, 0);
                font-size: 0.75rem;
                margin-left: 0.1rem;
              "
              >i</span
            >
          </div>
          <span style="font-size: 2.25rem; text-align: center">定位缩按钮</span>
        </el-button>
        <el-button
          @click="handlePouse"
          type="primary"
          size="small"
          style="
            width: 14.69rem;
            height: 5.06rem;
            color: rgba(64, 253, 240, 1);
            background-color: rgba(6, 229, 231, 0.3);
            border: none;
            border-top: 0.25rem solid rgba(6, 229, 231, 1);
          "
        >
          <div class="btnicon">
            <span
              style="
                width: 1rem;
                height: 1rem;
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: 50% 50%;
                border: 0.1rem solid rgb(0, 0, 0);
                color: rgb(0, 0, 0);
                font-size: 0.75rem;
                margin-left: 0.1rem;
              "
              >i</span
            >
          </div>
          <span style="font-size: 2.25rem; text-align: center">暂停</span>
        </el-button>
      </div>
      <el-button
        @click="jumpRouter('/PickAndDrop')"
        class="btn"
@@ -81,6 +179,9 @@
              </div>
              <span style="font-size: 2.25rem; text-align: center">缩回</span>
            </el-button>
            <div style="color: #fff; font-size: 2rem; margin-left: 15rem">
              å³ä¾§ä¼¸ç¼©æ†
            </div>
          </div>
        </div>
        <div class="operate">
@@ -173,6 +274,9 @@
              </div>
              <span style="font-size: 2.25rem; text-align: center">缩回</span>
            </el-button>
            <div style="color: #fff; font-size: 2rem; margin-left: 15rem">
              å·¦ä¾§ä¼¸ç¼©æ†
            </div>
          </div>
        </div>
        <div class="operate">
@@ -233,7 +337,7 @@
                  >i</span
                >
              </div>
              <span style="font-size: 2.25rem; text-align: center">伸出</span>
              <span style="font-size: 2.25rem; text-align: center">点动伸</span>
            </el-button>
            <el-button
              @click="handManualOperation('å·¦', '缩回')"
@@ -265,12 +369,13 @@
                  >i</span
                >
              </div>
              <span style="font-size: 2.25rem; text-align: center">缩回</span>
              <span style="font-size: 2.25rem; text-align: center">点动缩</span>
            </el-button>
          </div>
          <div style="color: #fff; font-size: 2rem; margin-left: 20rem">
            å·¦ä¾§ä¼¸ç¼©æ†
          </div>
          <div style="color: #fff; font-size: 2rem">左侧伸缩杆</div>
          <span style="color: #fff; font-size: 2rem"
            >当前伸缩杆位置：{{ Position.right }}</span
          >
        </div>
        <div class="operate">
          <div class="item">伸到位</div>
@@ -328,7 +433,7 @@
                  >i</span
                >
              </div>
              <span style="font-size: 2.25rem; text-align: center">伸出</span>
              <span style="font-size: 2.25rem; text-align: center">点动伸</span>
            </el-button>
            <el-button
              @click="handManualOperation('右', '缩回')"
@@ -360,12 +465,13 @@
                  >i</span
                >
              </div>
              <span style="font-size: 2.25rem; text-align: center">缩回</span>
              <span style="font-size: 2.25rem; text-align: center">点动缩</span>
            </el-button>
          </div>
          <div style="color: #fff; font-size: 2rem; margin-left: 20rem">
            å³ä¾§ä¼¸ç¼©æ†
          </div>
          <div style="color: #fff; font-size: 2rem">右侧伸缩杆</div>
          <span style="color: #fff; font-size: 2rem"
            >当前伸缩杆位置：{{ Position.right }}</span
          >
        </div>
        <div class="operate">
          <div class="item">伸到位</div>
@@ -397,10 +503,20 @@
import { ref, onMounted, nextTick } from "vue";
import { useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { ManualOperation } from "@/api/newapi/Parameters.js";
import {
  ManualOperation,
  GetPosition,
  AutoPickAndDrop,
  Pouse,
} from "@/api/newapi/Parameters.js";

const router = useRouter();
const isMobile = ref(false);
const Position = ref({
  left: 0,
  right: 0,
});

const jumpRouter = (path) => {
  router.push(path);
};
@@ -430,6 +546,44 @@

  console.log(res);
};
const handleAutoPickAndDrop = async (val) => {
  try {
    const response = await AutoPickAndDrop({
      ExtendedState: val,
    });
    if (response.code === 0) {
      ElMessage.success(`${val}成功`);
    } else {
      ElMessage.error(`${val}失败`);
    }
  } catch (error) {
    console.error(error);
    ElMessage.error("操作失败");
  }
};
const handlePouse = async () => {
  try {
    const response = await Pouse();
    if (response.code === 0) {
      ElMessage.success(response.message);
    } else {
      ElMessage.error(response.message);
    }
  } catch (error) {
    console.error(error);
    ElMessage.error(error);
  }
};

//获取当前位置
const getPosition = () => {
  GetPosition().then((res) => {
    if (res.code == 0) {
      Position.value.left = res.data.left;
      Position.value.right = res.data.right;
    }
  });
};
onMounted(() => {
  // ç›‘听窗口大小变化
  window.addEventListener("resize", () => {
@@ -449,6 +603,7 @@
    // å¦‚果窗口宽度小于等于1080px，执行相应的操作
    isMobile.value = false;
  }
  getPosition();
});
</script>
<style lang="scss" scoped>
@@ -460,7 +615,7 @@
  .button {
    height: 7.83rem;
    display: flex;
    justify-content: center;
    justify-content: space-between;

    .btn {
      position: relative;
@@ -876,7 +1031,7 @@

      .model {
        display: flex;

        justify-content: space-between;
        .model_btn {
          display: flex;

@@ -1031,7 +1186,7 @@

      .model {
        display: flex;

        justify-content: space-between;
        .model_btn {
          display: flex;