无人机管理后台前端(已迁走)
罗广辉
2025-10-10 8bfd657326eb9d4bd9b63920cfe3bd362cea4445
src/views/device/airport.vue
@@ -10,7 +10,8 @@
        </el-button>
      </template>
      <template #dept_name="{ row }">
        <el-tag>{{ row.dept_name }}</el-tag>
        <el-tag v-if="row.dept_name">{{ row.dept_name }}</el-tag>
        <span v-else>/</span>
      </template>
      <template #status="{ row }">
        <div v-if="row.status == true" class="onlineStatus">
@@ -126,14 +127,16 @@
      <el-input v-model="operate_password" disabled></el-input>
    </el-dialog>
    <el-dialog title="注销" class="zx-cancel" append-to-body v-model="cancenOperate" width="460px">
      <div style="display: flex;justify-content: center;margin-bottom: 10px;">注销
        <span style="color:cornflowerblue;font-weight: bolder;margin: 0px 4px;">
    <el-dialog title="注销" class="ztzf-dialog-mange zx-cancel" append-to-body v-model="cancenOperate" width="560px">
      <div class="txt-contain">
        <img :src="warnSvg" />注销
        <span class="name">
          {{ cancelSNName }}
        </span> 设备可能会影响相关数据,确认注销吗?</div>
        <div style="display: flex;justify-content: center;color:red;font-size: 12px;">*删除相关图片、视频、事件</div>
        </span> 设备可能会影响相关数据,确认注销吗?
      </div>
      <div class="delete-txt">*删除相关图片、视频、事件</div>
      <template #footer>
        <span class="dialog-footer" style="display: flex;justify-content: center;">
        <span class="dialog-footer">
          <el-button @click="cancenOperate = false">取 消</el-button>
          <el-button type="primary" @click="cancenOperateDo">确 定</el-button>
        </span>
@@ -186,7 +189,7 @@
      </template>
    </el-dialog>
    <el-drawer class="ztzf-drawer-body-basic-container" title="机场授权管理" size="60%" append-to-body
    <el-drawer class="ztzf-drawer-body-basic-container ztzf-el-card__body" title="机场授权管理" size="60%" append-to-body
      v-model="devicePerShareVisible" :direction="'rtl'">
      <DevicePerShare ref="devicePerShare" />
    </el-drawer>
@@ -200,6 +203,7 @@
<script>
import { ElMessage, ElMessageBox } from 'element-plus'
import { getRegionTreeAll } from '@/api/job/task';
import { pxToRem } from '@/utils/rem'
import {
  getList,
@@ -225,6 +229,8 @@
import DockControlPanel from './components/DockControlPanel.vue'
import { getWebsocketUrl } from '@/utils/websocket/config';
import ConnectWebSocket from '@/utils/websocket';
import warnSvg from '@/assets/images/warn.svg'
export default {
  components: {
    FirmwareManage,
@@ -232,6 +238,8 @@
    DockControlPanel,
  },
  data () {
    // const self = this
    const validatePass = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入密码'))
@@ -254,6 +262,7 @@
        password: [{ required: true, validator: validatePass, trigger: 'blur' }],
        password2: [{ required: true, validator: validatePass2, trigger: 'blur' }],
      },
      warnSvg: warnSvg,
      cancelSNName: '',
      cancenOperate: false,
      cancenOperateRow: {},
@@ -322,7 +331,7 @@
        grid: false,
        height: 'auto',
        calcHeight: 180,
        calcHeight: 20,
        column: [
          {
@@ -390,7 +399,8 @@
          {
            label: '设备位置',
            prop: 'area_code',
            type: 'cascader',
            // type: 'cascader',
            type: 'tree',
            labelWidth: 145,
            searchSpan: 4,
            hide: true,
@@ -399,15 +409,13 @@
            editDisplay: true,
            viewDisplay: true,
            checkStrictly: true,
            defaultExpandAll: true,
            dicData: [],
            props: {
              label: 'title',
              value: 'value',
              emitPath: false,
              multiple: false,
              expandTrigger: 'hover',
              label: 'name',
              value: 'id',
              children: 'childrens',
            },
            dataType: 'string',
            rules: [
              {
                required: true,
@@ -415,39 +423,6 @@
                trigger: 'change',
              },
            ],
            lazy: true,
            lazyLoad (node, resolve) {
              let level = node.level
              let list = []
              let callback = () => {
                resolve(
                  (list || []).map(ele => ({
                    ...ele,
                    value: ele.value,
                    leaf: level >= 2,
                  }))
                )
              }
              if (level === 0) {
                getLazyTree('000000000000').then(res => {
                  list = res.data.data
                  callback()
                })
              } else if (level === 1) {
                getLazyTree(node.value).then(res => {
                  list = res.data.data
                  callback()
                })
              } else if (level === 2) {
                getLazyTree(node.value).then(res => {
                  list = res.data.data
                  callback()
                })
              } else {
                callback()
              }
            },
          },
          {
            label: '设备名称',
@@ -573,30 +548,32 @@
            viewDisplay: false,
          },
          {
            label: '所属单位',
            label: '所属部门',
            prop: 'dept_name',
            addDisplay: false,
            editDisplay: false,
            viewDisplay: false,
            align: 'center',
            labelWidth: 145,
            width: 180,
            rules: [
              {
                required: true,
                message: '请输入所属单位',
                message: '请输入所属部门',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '所属单位',
            label: '所属部门',
            prop: 'dept_id',
            hide: true,
            type: 'tree',
            defaultExpandAll: true,
            search: true,
            searchSpan: 4,
            labelWidth: 145,
            defaultExpandAll: true,
            dicUrl: '/blade-system/dept/getTree',
            props: {
              label: 'name',
@@ -605,7 +582,7 @@
            rules: [
              {
                required: true,
                message: '请输入所属单位',
                message: '请输入所属部门',
                trigger: 'blur',
              },
            ],
@@ -784,8 +761,9 @@
      },
    }
  },
  computed: {
    ...mapGetters(['permission']),
    ...mapGetters(['permission', 'userInfo']),
    permissionList () {
      return {
        addBtn: this.validData(this.permission.air_add, true),
@@ -813,7 +791,10 @@
    })
  },
  mounted() {
    getRegionTreeAll({ parentCode: this.userInfo.detail.areaCode }).then(res => {
      const column = this.findObject(this.option.column, 'area_code');
      column.dicData = res.data.data ? [res.data.data] : [];
    });
  },
  methods: {
    getDockModeText (value) {
@@ -1348,6 +1329,7 @@
        })
    },
    async getFullAreaCode (areaCode) {
      console.log('getFullAreaCode', areaCode)
      if (!areaCode) return ''
      const code = areaCode.toString()
@@ -1369,10 +1351,9 @@
      if (['edit', 'view'].includes(type)) {
        getDetail(this.form.id).then(async res => {
          const data = res.data.data
          this.form = {
            ...data,
            area_code: await this.getFullAreaCode(data.area_code),
            // area_code: await this.getFullAreaCode(data.area_code),
            area_name: this.form.area_name,
            cnmode_code: this.getDockModeText(this.form.mode_code),
            domainTxt: data.domain === 0 ? '无人机' : data.domain === 3 ? '机巢' : '未知',
@@ -1442,23 +1423,23 @@
        resolve(data)
      })
    },
    rowDel (row) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          return remove(row.id)
        })
        .then(() => {
          this.onLoad(this.page)
          this.$message({
            type: 'success',
            message: '操作成功!',
          })
        })
    },
    // rowDel (row) {
    //   this.$confirm('确定将选择数据删除?', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning',
    //   })
    //     .then(() => {
    //       return remove(row.id)
    //     })
    //     .then(() => {
    //       this.onLoad(this.page)
    //       this.$message({
    //         type: 'success',
    //         message: '操作成功!',
    //       })
    //     })
    // },
    // 设置无人机操作密码
    setOperatePasswordConfirm () {
      var that = this
@@ -1583,5 +1564,37 @@
  right: 30px;
}
.force-center-dialog .el-dialog {
}
.zx-cancel {
  .txt-contain {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
    font-family: Source Han Sans CN, Source Han Sans CN;
    font-weight: 400;
    font-size: 14px;
    img {
      width: 20px;
      height: 20px;
    }
    .name {
      color: #0E8BFF;
      margin-left: 6px;
      margin-right: 6px;
    }
  }
  .delete-txt {
    font-family: Source Han Sans CN, Source Han Sans CN;
    font-weight: 400;
    display: flex;
    justify-content: center;
    color: #FF0000;
    font-size: 12px;
    margin-bottom: 20px;
  }
}
</style>