UA 整理提交

he wei

2025-04-23 b9bd29a1a81f6f7de479e3cc3fdfe3d85fc660bf

 src/views/device/keys/addEdit.vue

@@ -1,49 +1,44 @@
<script setup>
import { ref, reactive, computed, onMounted } from "vue";
import { addKey, updateKey } from "@/api/keys";
// import { addKey, updateKey } from "@/api/keys";
import useElement from "@/hooks/useElement.js";
import { getAllUserName } from "@/api/user";
const { $loading, $message, $confirm } = useElement();
import {
   addCard,
   delCard,
} from '@/api/keys.js';

const props = defineProps({
  info: {
    type: Object,
  isUnbind: {
    type: Boolean,
    default: false,
  },
  lockId: {
    type: [String, Number],
    default: "",
  },
  list: {
    type: Array,
    default: () => [],
  },
});
const formRef = ref();
const areaList = ref([]);
const userList = ref([]);

const form1 = reactive({
  uname: "",
  keyType: "",
  uid: "",
  keyNumber: "",
  keyName: "",
  cardIdInput: "",
  cardIdSelect: "",
});

const rules = {
  uname: [
  cardIdInput: [
    {
      required: true,
      message: "不能为空",
      trigger: ["blur", "change"],
    },
  ],
  keyType: [
    {
      required: true,
      message: "不能为空",
      trigger: ["blur", "change"],
    },
  ],
  keyName: [
    {
      required: true,
      message: "不能为空",
      trigger: ["blur", "change"],
    },
  ],
  keyNumber: [
  cardIdSelect: [
    {
      required: true,
      message: "不能为空",
@@ -52,27 +47,16 @@
  ],
};

const isEdit = computed(() => !!props.info?.keyName);
const $emit = defineEmits(["cancel", "success"]);
function close() {
  $emit("cancel");
}

// 查询所有用户
async function getAllUser() {
  let res = await getAllUserName();
  let { code, data, data2 } = res;
  let _list = [];
  if (code && data) {
    _list = data2;
  }
  userList.value = _list;
}




async function update() {
async function unBindCard() {
  let valid = await formRef.value.validate(() => { });
  // console.log('valid', valid, '=============');

@@ -80,34 +64,26 @@
    $message.error("表单验证失败");
    return false;
  }
  let params = {
    // uid: form1.uid,
    uname: form1.uname,
    keyName: form1.keyName?.trim(),
    keyNumber: form1.keyNumber?.trim() || undefined,
    keyId: props.info.keyId,
    keyType: form1.keyType
  };
  console.log("params update", params, "=============");

  let loading = $loading();
  updateKey(params)
    .then((res) => {
      let { code, data } = res;
      if (code && data) {
        $emit("success");
        $message.success("操作成功");
      } else {
        $message.error("操作失败");
      }
      loading.close();
    })
    .catch((err) => {
      console.log(err);
      loading.close();
    });

  delCard(form1.cardIdSelect, props.lockId).then((res) => {
    let { code, data } = res;
    loading.close();
    if (code && data) {
      // console.log(data);
      $message.success("操作成功");
      $emit("success");
    } else {
      $message.error("操作失败");
    }
  })
  .catch((err) => {
    console.log(err);
    loading.close();
  });
}
async function onSubmit() {
async function bindCard() {
  let valid = await formRef.value.validate(() => { });
  // console.log('valid', valid, '=============');

@@ -115,31 +91,32 @@
    $message.error("表单验证失败");
    return false;
  }
  let params = {
    // uid: form1.uid,
    uname: form1.uname,
    keyName: form1.keyName?.trim(),
    keyNumber: form1.keyNumber?.trim() || undefined,
    keyType: form1.keyType
  };
  console.log("params", params, "=============");
  form1.cardIdInput = form1.cardIdInput.trim();

  // 如果输入的卡号存在于list中,那么就提示并退出
  if (props.list.includes(form1.cardIdInput)) {
    $message.error("该卡号已存在");
    return false;
  }
  

  let loading = $loading();
  addKey(params)
    .then((res) => {
      let { code, data } = res;
      if (code && data) {
        $emit("success");
        $message.success("操作成功");
      } else {
        $message.error("操作失败");
      }
      loading.close();
    })
    .catch((err) => {
      console.log(err);
      loading.close();
    });

  addCard(form1.cardIdInput, props.lockId).then((res) => {
    let { code, data } = res;
    loading.close();
    if (code && data) {
      console.log(data);
      $message.success("操作成功");
      $emit("success");
    } else {
      $message.error("操作失败");
    }
  })
  .catch((err) => {
    console.log(err);
    loading.close();
  });
}


@@ -152,33 +129,23 @@
    form1.keyName = info.keyName;
    form1.keyNumber = info.keyNumber;
  }
  getAllUser();
});
</script>

<template>
  <div class="">
    <el-form ref="formRef" :model="form1" label-width="80px" :rules="rules">
      <el-form-item label="归属人" prop="uname">
        <el-select v-model="form1.uname">
          <el-option v-for="(item, idx) in userList" :key="'key_' + idx" :label="item" :value="item" />
      <el-form-item v-if="!isUnbind" label="电子卡号" prop="cardIdInput">
        <el-input v-model="form1.cardIdInput"></el-input>
      </el-form-item>
      <el-form-item v-else label="电子卡号" prop="cardIdSelect">
        <el-select v-model="form1.cardIdSelect">
          <el-option v-for="(item, idx) in list" :key="'key_' + idx" :label="item" :value="item" />
        </el-select>
      </el-form-item>
      <el-form-item label="钥匙类型" prop="keyType">
        <el-select v-model="form1.keyType">
          <el-option label="ID钥匙" :value="1" />
          <el-option label="机械钥匙" :value="2" />
        </el-select>
      </el-form-item>
      <el-form-item label="钥匙名称" prop="keyName">
        <el-input v-model="form1.keyName"></el-input>
      </el-form-item>
      <el-form-item label="钥匙编号" prop="keyNumber" v-if="form1.keyType == 1">
        <el-input v-model="form1.keyNumber"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button v-if="isEdit" type="primary" @click="update">修改</el-button>
        <el-button v-else type="primary" @click="onSubmit">新增</el-button>
        <el-button v-if="isUnbind" type="primary" @click="unBindCard">解绑</el-button>
        <el-button v-else type="primary" @click="bindCard">绑定</el-button>
        <el-button @click="close">取消</el-button>
      </el-form-item>
    </el-form>