| | |
| | | <template> |
| | | <div class="Manualcontrol"> |
| | | <div class="button"> |
| | | <el-button @click="jumpRouter('/PickAndDrop')" class="btn" type="primary" size="small" |
| | | style="width: 27.52rem; height: 4.29rem; color: rgba(255, 255, 255, 1)"> |
| | | <span class="Aspan" style="font-size: 2.25rem; text-align: center">è¿å</span> |
| | | <el-button |
| | | @click="jumpRouter('/PickAndDrop')" |
| | | class="btn" |
| | | type="primary" |
| | | size="small" |
| | | style="width: 27.52rem; height: 4.29rem; color: rgba(255, 255, 255, 1)" |
| | | > |
| | | <span class="Aspan" style="font-size: 2.25rem; text-align: center" |
| | | >è¿å</span |
| | | > |
| | | </el-button> |
| | | </div> |
| | | <div v-if="isMobile" class="content"> |
| | | <div class="content_l"> |
| | | <div class="model"> |
| | | <div class="model_btn"> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å·¦', '伸åº')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <span style="font-size: 2.25rem; text-align: center">伸åº</span> |
| | | </el-button> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å·¦', '缩å')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <span style="font-size: 2.25rem; text-align: center">缩å</span> |
| | | </el-button> |
| | |
| | | <div class="content_r"> |
| | | <div class="model"> |
| | | <div class="model_btn"> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å³', '伸åº')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <span style="font-size: 2.25rem; text-align: center">伸åº</span> |
| | | </el-button> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å³', '缩å')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <span style="font-size: 2.25rem; text-align: center">缩å</span> |
| | | </el-button> |
| | | </div> |
| | | |
| | | </div> |
| | | <div class="operate"> |
| | | <div class="item">伸å°ä½</div> |
| | |
| | | <div class="content_l"> |
| | | <div class="model"> |
| | | <div class="model_btn"> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å·¦', '伸åº')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <span style="font-size: 2.25rem; text-align: center">伸åº</span> |
| | | </el-button> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å·¦', '缩å')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <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; margin-left: 20rem"> |
| | | 左侧伸缩æ |
| | | </div> |
| | | </div> |
| | | <div class="operate"> |
| | | <div class="item">伸å°ä½</div> |
| | |
| | | <div class="content_r"> |
| | | <div class="model"> |
| | | <div class="model_btn"> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å³', '伸åº')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <span style="font-size: 2.25rem; text-align: center">伸åº</span> |
| | | </el-button> |
| | | <el-button type="primary" size="small" style=" |
| | | <el-button |
| | | @click="handManualOperation('å³', '缩å')" |
| | | 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=" |
| | | <span |
| | | style=" |
| | | width: 1rem; |
| | | height: 1rem; |
| | | display: flex; |
| | |
| | | color: rgb(0, 0, 0); |
| | | font-size: 0.75rem; |
| | | margin-left: 0.1rem; |
| | | ">i</span> |
| | | " |
| | | >i</span |
| | | > |
| | | </div> |
| | | <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; margin-left: 20rem"> |
| | | å³ä¾§ä¼¸ç¼©æ |
| | | </div> |
| | | </div> |
| | | <div class="operate"> |
| | | <div class="item">伸å°ä½</div> |
| | |
| | | <script setup> |
| | | import { ref, onMounted, nextTick } from "vue"; |
| | | import { useRouter } from "vue-router"; |
| | | import { ElMessage } from "element-plus"; |
| | | import { ManualOperation } from "@/api/newapi/Parameters.js"; |
| | | |
| | | const router = useRouter(); |
| | | const isMobile = ref(false); |
| | | const jumpRouter = (path) => { |
| | | router.push(path); |
| | | }; |
| | | const handManualOperation = async (position, ExtendedState) => { |
| | | try { |
| | | const res = await ManualOperation({ |
| | | position: position, |
| | | ExtendedState: ExtendedState, |
| | | }); |
| | | if (res.code === 0) { |
| | | ElMessage({ |
| | | message: `${position}ä¾§${ExtendedState}æå`, |
| | | type: "success", |
| | | }); |
| | | } else { |
| | | ElMessage({ |
| | | message: `${position}侧${ExtendedState}失败`, |
| | | type: "error", |
| | | }); |
| | | } |
| | | } catch (error) { |
| | | ElMessage({ |
| | | message: "æä½å¤±è´¥", |
| | | type: "error", |
| | | }); |
| | | } |
| | | |
| | | console.log(res); |
| | | }; |
| | | onMounted(() => { |
| | | // çå¬çªå£å¤§å°åå |
| | | window.addEventListener("resize", () => { |
| | |
| | | width: 8.75rem; |
| | | height: 4.19rem; |
| | | border-radius: 0.31rem; |
| | | background: linear-gradient(90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100%); |
| | | background: linear-gradient( |
| | | 90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100% |
| | | ); |
| | | color: rgba(16, 16, 16, 1); |
| | | color: rgb(255, 255, 255); |
| | | font-size: 1.13rem; |
| | |
| | | width: 8.75rem; |
| | | height: 4.19rem; |
| | | border-radius: 0.31rem; |
| | | background: linear-gradient(90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100%); |
| | | background: linear-gradient( |
| | | 90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100% |
| | | ); |
| | | color: rgba(16, 16, 16, 1); |
| | | color: rgb(255, 255, 255); |
| | | font-size: 1.13rem; |
| | |
| | | width: 8.75rem; |
| | | height: 4.19rem; |
| | | border-radius: 0.31rem; |
| | | background: linear-gradient(90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100%); |
| | | background: linear-gradient( |
| | | 90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100% |
| | | ); |
| | | color: rgba(16, 16, 16, 1); |
| | | color: rgb(255, 255, 255); |
| | | font-size: 1.13rem; |
| | |
| | | width: 8.75rem; |
| | | height: 4.19rem; |
| | | border-radius: 0.31rem; |
| | | background: linear-gradient(90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100%); |
| | | background: linear-gradient( |
| | | 90deg, |
| | | rgba(0, 224, 255, 0.74) 0%, |
| | | rgba(0, 224, 255, 0.4) 60%, |
| | | rgba(235, 242, 243, 0.13) 100% |
| | | ); |
| | | color: rgba(16, 16, 16, 1); |
| | | color: rgb(255, 255, 255); |
| | | font-size: 1.13rem; |
| | |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | | </style> |