From 915f34dea4ed97b5c7521fe6984744b4a79bdeee Mon Sep 17 00:00:00 2001
From: zrj <646384940@qq.com>
Date: Wed, 28 Aug 2024 17:21:11 +0800
Subject: [PATCH] 新增无人机操作密码设置

---
 src/views/device/fly.vue |  153 ++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 134 insertions(+), 19 deletions(-)

diff --git a/src/views/device/fly.vue b/src/views/device/fly.vue
index c6e4e63..62f527d 100644
--- a/src/views/device/fly.vue
+++ b/src/views/device/fly.vue
@@ -34,26 +34,102 @@
         <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"
+          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>
-        <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"
+          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>
       </template>
+      <template #menu="scope">
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-setting"
+          v-if="permission.operate_password_set"
+          @click.stop="handleOperatePassword(scope.row, scope.index)"
+          >操控密码设置
+        </el-button>
+        <!-- <el-button
+          type="primary"
+          text
+          icon="el-icon-view"
+          v-if="permission.operate_password_view"
+          @click.stop="viewOperatePassword(scope.row, scope.index)"
+          >操控密码查看
+        </el-button> -->
+      </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-item label="密码" prop="password">
+          <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-form-item>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="operatePasswordSetBox = false">取 消</el-button>
+          <el-button type="primary" @click="setOperatePasswordConfirm">确 定</el-button>
+        </span>
+      </template>
+    </el-dialog>
+    <el-dialog title="操控密码查看" append-to-body v-model="operatePasswordViewBox" width="455px">
+      <el-input v-model="operate_password" disabled></el-input>
+    </el-dialog>
   </basic-container>
 </template>
 
 <script>
-import { getList, remove, update, add, getDetail } from '@/api/device/device';
+import { getList, remove, update, add, getDetail,getOperatePassword,operatePasswordUpdate } from '@/api/device/device';
 import { mapGetters } from 'vuex';
 
 export default {
   data() {
+    const validatePass = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请输入密码'));
+      } else {
+        callback();
+      }
+    };
+    const validatePass2 = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请再次输入密码'));
+      } else if (value !== this.passwordForm.password) {
+        callback(new Error('两次输入密码不一致!'));
+      } else {
+        callback();
+      }
+    };
     return {
+      loadingForm:false,
+      rules: {
+        password: [{ required: true, validator: validatePass, trigger: 'blur' }],
+        password2: [{ required: true, validator: validatePass2, trigger: 'blur' }],
+      },
+      passwordForm:{
+        id:'',
+        password:'',
+        password2:'',
+      },
+      operatePasswordSetBox: false,
+      operatePasswordViewBox: false,
+      operate_password: '',
       form: {},
       query: {},
       loading: true,
@@ -74,7 +150,7 @@
         index: true,
         viewBtn: true,
         selection: true,
-        addBtn:false,
+        addBtn: false,
         excelBtn: false,
         dialogClickModal: false,
         grid: false,
@@ -83,9 +159,9 @@
             label: '设备型号',
             prop: 'device_name',
             search: true,
-            searchSpan:4,
+            searchSpan: 4,
             labelWidth: 130,
-            editDisabled:true,
+            editDisabled: true,
             rules: [
               {
                 required: true,
@@ -98,9 +174,9 @@
             label: '设备SN',
             prop: 'device_sn',
             labelWidth: 130,
-            search:true,
-            searchSpan:4,
-            editDisabled:true,
+            search: true,
+            searchSpan: 4,
+            editDisabled: true,
             rules: [
               {
                 required: true,
@@ -138,8 +214,8 @@
             label: '固件版本',
             prop: 'firmware_version',
             labelWidth: 130,
-            width:100,
-            editDisabled:true,
+            width: 100,
+            editDisabled: true,
             rules: [
               {
                 required: true,
@@ -191,7 +267,7 @@
             editDisplay: false,
             type: 'date',
             labelWidth: 130,
-            width:160,
+            width: 160,
             format: 'YYYY-MM-DD HH:mm:ss',
             // valueFormat: 'YYYY-MM-DD HH:mm:ss',
             rules: [
@@ -209,7 +285,7 @@
             addDisplay: false,
             editDisplay: false,
             labelWidth: 130,
-            width:160,
+            width: 160,
             format: 'YYYY-MM-DD HH:mm:ss',
             // valueFormat: 'YYYY-MM-DD HH:mm:ss',
             startPlaceholder: '任务开始时间',
@@ -261,7 +337,46 @@
     },
   },
   methods: {
-    init(){
+    // 设置无人机操作密码
+    setOperatePasswordConfirm() {
+      var that = this;
+      this.$refs.passwordForm.validate(valid => {
+        if (valid) {
+          this.loadingForm = true;
+          const data = {
+            id:this.passwordForm.id,
+            operate_password: this.passwordForm.password
+          }
+          // 提交
+          operatePasswordUpdate(data).then(res => {
+            this.loadingForm = false;
+            this.operatePasswordSetBox = false;
+            that.passwordForm = {}
+            this.onLoad(this.page);
+            this.$message({
+              type: 'success',
+              message: '操作成功!',
+            });
+          });
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    // 操作密码设置
+    handleOperatePassword(row) {
+      this.operatePasswordSetBox = true;
+      this.passwordForm.id = row.id
+    },
+    viewOperatePassword(row){
+      this.operatePasswordViewBox = true;
+      // 查询密码
+      getOperatePassword(row.id).then(res=>{
+         this.operate_password = res.data.data;
+      })
+    },
+    init() {
       this.onLoad(this.page);
     },
     rowSave(row, done, loading) {
@@ -383,7 +498,7 @@
         };
         values.releaseTimeRange = null;
       }
-      values['domain'] = 0
+      values['domain'] = 0;
       this.loading = true;
       getList(page.currentPage, page.pageSize, values).then(res => {
         const data = res.data.data;

--
Gitblit v1.9.3