From 0082fa417fb2af9add3406bf05ab3e3e45890c34 Mon Sep 17 00:00:00 2001
From: rain <1679827795@qq.com>
Date: Thu, 12 Jun 2025 14:30:02 +0800
Subject: [PATCH] Merge branch 'master' of http://139.196.74.78:10010/r/drone/drone-web-manage
---
src/views/device/fly.vue | 139 ++++++++++++++++++++++++++++++++-------------
1 files changed, 98 insertions(+), 41 deletions(-)
diff --git a/src/views/device/fly.vue b/src/views/device/fly.vue
index 62f527d..2fd28b2 100644
--- a/src/views/device/fly.vue
+++ b/src/views/device/fly.vue
@@ -1,10 +1,12 @@
<template>
<basic-container>
<avue-crud
+ id="device"
:option="option"
:table-loading="loading"
:data="data"
- v-model:page="page"
+ :page="page"
+ @update:page="handlePageChange"
ref="crud"
@row-del="rowDel"
v-model="form"
@@ -18,7 +20,6 @@
@current-change="currentChange"
@size-change="sizeChange"
@refresh-change="refreshChange"
- @on-load="onLoad"
>
<template #menu-left>
<el-button
@@ -34,23 +35,13 @@
<el-tag>{{ row.dept_name }}</el-tag>
</template>
<template #status="{ row }">
- <div
- v-if="row.status == true"
- style="display: flex; flex-direction: row; align-items: center"
- >
- <div
- style="width: 15px; height: 15px; background-color: #40cb8b; border-radius: 50%"
- ></div>
- <span style="margin-left: 5px">在线</span>
+ <div v-if="row.status == true" class="onlineStatus">
+ <div class="onlineStatus-dot"></div>
+ <span class="online" >在线</span>
</div>
- <div
- v-if="row.status == false"
- style="display: flex; flex-direction: row; align-items: center"
- >
- <div
- style="width: 15px; height: 15px; background-color: #de5e5e; border-radius: 50%"
- ></div>
- <span style="margin-left: 5px">离线</span>
+ <div v-if="row.status == false" class="onlineStatus">
+ <div class="onlineStatus-dot1"></div>
+ <span class="online">离线</span>
</div>
</template>
<template #menu="scope">
@@ -73,12 +64,28 @@
</template>
</avue-crud>
<el-dialog title="操控密码设置" append-to-body v-model="operatePasswordSetBox" width="455px">
- <el-form :model="passwordForm" ref="passwordForm" label-width="80px" :rules="rules" v-loading="loadingForm">
+ <el-form
+ :model="passwordForm"
+ ref="passwordForm"
+ label-width="80px"
+ :rules="rules"
+ v-loading="loadingForm"
+ >
<el-form-item label="密码" prop="password">
- <el-input type="password" v-model="passwordForm.password" placeholder="请输入密码" show-password></el-input>
+ <el-input
+ type="password"
+ v-model="passwordForm.password"
+ placeholder="请输入密码"
+ show-password
+ ></el-input>
</el-form-item>
<el-form-item label="确认密码" prop="password2">
- <el-input type="password" v-model="passwordForm.password2" placeholder="请输入确认密码" show-password></el-input>
+ <el-input
+ type="password"
+ v-model="passwordForm.password2"
+ placeholder="请输入确认密码"
+ show-password
+ ></el-input>
</el-form-item>
</el-form>
<template #footer>
@@ -95,7 +102,15 @@
</template>
<script>
-import { getList, remove, update, add, getDetail,getOperatePassword,operatePasswordUpdate } from '@/api/device/device';
+import {
+ getList,
+ remove,
+ update,
+ add,
+ getDetail,
+ getOperatePassword,
+ operatePasswordUpdate,
+} from '@/api/device/device';
import { mapGetters } from 'vuex';
export default {
@@ -117,15 +132,15 @@
}
};
return {
- loadingForm:false,
+ loadingForm: false,
rules: {
password: [{ required: true, validator: validatePass, trigger: 'blur' }],
password2: [{ required: true, validator: validatePass2, trigger: 'blur' }],
},
- passwordForm:{
- id:'',
- password:'',
- password2:'',
+ passwordForm: {
+ id: '',
+ password: '',
+ password2: '',
},
operatePasswordSetBox: false,
operatePasswordViewBox: false,
@@ -140,9 +155,9 @@
},
selectionList: [],
option: {
- height: '460',
- calcHeight: 32,
- dialogWidth: 950,
+ // height: '460',
+ // calcHeight: 32,
+ // dialogWidth: 950,
tip: false,
searchShow: true,
searchMenuSpan: 6,
@@ -344,14 +359,14 @@
if (valid) {
this.loadingForm = true;
const data = {
- id:this.passwordForm.id,
- operate_password: this.passwordForm.password
- }
+ id: this.passwordForm.id,
+ operate_password: this.passwordForm.password,
+ };
// 提交
operatePasswordUpdate(data).then(res => {
this.loadingForm = false;
this.operatePasswordSetBox = false;
- that.passwordForm = {}
+ that.passwordForm = {};
this.onLoad(this.page);
this.$message({
type: 'success',
@@ -367,17 +382,22 @@
// 操作密码设置
handleOperatePassword(row) {
this.operatePasswordSetBox = true;
- this.passwordForm.id = row.id
+ this.passwordForm.id = row.id;
},
- viewOperatePassword(row){
+ viewOperatePassword(row) {
this.operatePasswordViewBox = true;
// 查询密码
- getOperatePassword(row.id).then(res=>{
- this.operate_password = res.data.data;
- })
+ getOperatePassword(row.id).then(res => {
+ this.operate_password = res.data.data;
+ });
},
init() {
- this.onLoad(this.page);
+ (this.page = {
+ pageSize: 10,
+ currentPage: 1,
+ total: 0,
+ }),
+ this.onLoad(this.page);
},
rowSave(row, done, loading) {
add(row).then(
@@ -475,11 +495,18 @@
}
done();
},
+ handlePageChange(val) {
+ this.page = val;
+ this.onLoad(this.page);
+ },
currentChange(currentPage) {
this.page.currentPage = currentPage;
+ this.onLoad(this.page);
},
sizeChange(pageSize) {
this.page.pageSize = pageSize;
+ this.page.currentPage = 1;
+ this.onLoad(this.page);
},
refreshChange() {
this.onLoad(this.page, this.query);
@@ -512,4 +539,34 @@
};
</script>
-<style></style>
+<style lang="scss" scoped>
+:deep(#device .el-card__body .avue-crud__body .el-form) {
+ height: 655px !important;
+ overflow: auto;
+}
+.online {
+ margin-left: 5px;
+}
+.onlineStatus1 {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+.onlineStatus {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+}
+.onlineStatus-dot {
+ width: 15px;
+ height: 15px;
+ background-color: #40cb8b;
+ border-radius: 50%;
+}
+.onlineStatus-dot1 {
+ width: 15px;
+ height: 15px;
+ background-color: #de5e5e;
+ border-radius: 50%;
+}
+</style>
--
Gitblit v1.9.3