人员卡管理

src/assets/js/constant.js

@@ -16,9 +16,8 @@ export const MENU = [
   { title: "高危作业管理", model: MODEL["3"] },
   { title: "监测预警", model: MODEL["4"] },
   { title: "综合管理", model: MODEL["5"] },
-  { title: "人员定位", model: MODEL["6"] },
+  { title: "定位管理", model: MODEL["6"] },
 ];
-
 export const PRINT_STYLE =
   '<style type="text/css" media="print">\n' +
   "  @page { size: landscape; }\n" +

src/request/positioning.js

@@ -0,0 +1,21 @@
+import { post } from "@/request/axios.js";
+
+// 定位管理 接口
+// 设备管理 ====
+export const getDeployCardList = (params) => post("/deploy/card/list", params); // 人员卡列表
+export const getDeployCardView = (params) =>
+  post("/deploy/card/goEdit", params); // 人员卡详情
+export const setEditDeployCardData = (params) =>
+  post("/deploy/card/edit", params); // 修改
+export const setAddDeployCardData = (params) =>
+  post("/deploy/card/addInBulk", params); // 批量制卡
+export const setRemoveDeployCardData = (params) =>
+  post("/deploy/card/remove", params); // 批量删除
+export const setUnbindingDeployCardData = (params) =>
+  post("/deploy/card/batchUnbinding", params); // 批量解绑
+
+export const getNotBindTheCardData = (params) =>
+  post("/deploy/card/thePersonWhoDidNotBindTheCard", params); // 批量解绑
+
+
+// 设备管理 ====

src/views/device_manager/user_card/components/batchaddcard.vue

@@ -0,0 +1,80 @@
+<template>
+  <el-dialog v-model="visible" title="批量制卡" :on-close="fnClose">
+    <div>
+      <el-form :model="data.form" label-width="120px">
+        <el-form-item label="卡号范围">
+          <el-col :span="10">
+            <el-input-number
+              v-model="data.form.begin"
+              :min="1"
+              @change="handleChange"
+            />
+          </el-col>
+          <el-col :span="4" style="text-align: center">
+            <span>~~~</span>
+          </el-col>
+          <el-col :span="10">
+            <el-input-number
+              v-model="data.form.end"
+              :min="data.form.begin + 1"
+              @change="handleChange"
+            />
+          </el-col>
+        </el-form-item>
+      </el-form>
+    </div>
+    <template #footer>
+      <el-button @click="fnClose">取 消</el-button>
+      <el-button type="primary" @click="fnSubmit">确 定</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { useVModels } from "@vueuse/core";
+import { debounce } from "throttle-debounce";
+import { reactive } from "vue";
+import { setAddDeployCardData } from "@/request/positioning.js";
+const data = reactive({
+  form: {
+    cardNo: "",
+    begin: 1,
+    end: 2,
+  },
+});
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false,
+  },
+});
+const handleChange = () => {
+  if (data.form.begin > data.form.end) {
+    data.form.end = data.form.begin + 1;
+  }
+};
+const emits = defineEmits(["update:visible", "submit"]);
+const { visible } = useVModels(props, emits);
+const fnClose = () => {
+  visible.value = false;
+  data.form = {
+    cardNo: "",
+    begin: 1,
+    end: 2,
+  };
+};
+const fnSubmit = debounce(
+  1000,
+  async () => {
+    await setAddDeployCardData({
+      ...data.form,
+    });
+    fnClose();
+    emits("submit");
+  },
+  { atBegin: true }
+);
+</script>
+
+<style scoped lang="scss"></style>

src/views/device_manager/user_card/components/editcard.vue

@@ -0,0 +1,88 @@
+<template>
+  <el-dialog v-model="visible" title="修改" :on-close="fnClose">
+    <div>
+      <el-form ref="formRef" :model="form" label-width="120px">
+        <el-form-item label="卡号">
+          {{ form.cardNo }}
+        </el-form-item>
+        <el-form-item label="人员">
+          <el-select
+            v-model="form.psnId"
+            class="m-2"
+            placeholder="请选择人员"
+            size="large"
+            style="width: 240px"
+          >
+            <el-option
+              v-for="item in data.options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+              :disabled="item.disabled"
+            /> </el-select
+        ></el-form-item>
+      </el-form>
+    </div>
+    <template #footer>
+      <el-button @click="fnClose">取 消</el-button>
+      <el-button type="primary" @click="fnSubmit">确 定</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { useVModels } from "@vueuse/core";
+import { debounce } from "throttle-debounce";
+import { reactive, ref } from "vue";
+import {
+  getNotBindTheCardData,
+  setEditDeployCardData,
+} from "@/request/positioning.js";
+import { ElMessage } from "element-plus";
+const data = reactive({
+  options: [],
+});
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false,
+  },
+  form: {
+    type: Object,
+    required: true,
+    default: () => ({}),
+  },
+});
+const formRef = ref(null);
+
+const emits = defineEmits(["update:visible", "update:form", "get-data"]);
+const { visible, form } = useVModels(props, emits);
+const fnClose = () => {
+  formRef.value.resetFields();
+  visible.value = false;
+};
+const fngetNotBindTheCardData = async () => {
+  const res = await getNotBindTheCardData();
+  data.options = res.data.map((item) => ({
+    value: item.psnId,
+    label: item.name,
+    disabled: item.disabled === "1",
+  }));
+};
+fngetNotBindTheCardData();
+const fnSubmit = debounce(
+  1000,
+  async () => {
+    await setEditDeployCardData({
+      ...form.value,
+    });
+    fnClose();
+    ElMessage.success("操作成功");
+    emits("get-data");
+  },
+  { atBegin: true }
+);
+</script>
+
+<style scoped lang="scss"></style>

src/views/device_manager/user_card/index.vue

@@ -0,0 +1,155 @@
+<template>
+  <div>
+    <el-card>
+      <el-form
+        :model="searchForm"
+        label-width="100px"
+        @submit.prevent="fnResetPaginationTransfer"
+      >
+        <el-row>
+          <el-col :span="6">
+            <el-form-item label="关键字" prop="KEYWORDS">
+              <el-input v-model="searchForm.KEYWORDS" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label-width="10px">
+              <el-button type="primary" native-type="submit">搜索</el-button>
+              <el-button native-type="reset" @click="fnResetPaginationTransfer">
+                重置
+              </el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+    <layout-card>
+      <layout-table
+        ref="tableRef"
+        v-model:pagination="pagination"
+        :data="list"
+        @get-data="fnGetDataTransfer"
+      >
+        <el-table-column reserve-selection type="selection" width="55" />
+        <el-table-column label="序号" width="60">
+          <template #default="{ $index }">
+            {{ serialNumber(pagination, $index) }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="cardNo" label="卡号" />
+        <el-table-column prop="name" label="绑定人" />
+        <el-table-column prop="stset" label="电量" />
+        <el-table-column prop="remark" label="备注" />
+        <el-table-column label="操作" width="200">
+          <template #default="{ row }">
+            <el-button
+              type="primary"
+              text
+              link
+              @click="fnEditDataInfo(row)"
+            >
+              修改
+            </el-button>
+          </template>
+        </el-table-column>
+        <template #button>
+          <el-button
+            type="primary"
+            @click="data.batchaddcardDialog.visible = true"
+          >
+            批量制卡
+          </el-button>
+          <el-button type="warning" @click="batchUnbinding">
+            批量解绑
+          </el-button>
+          <el-button type="danger" @click="batchDelete"> 批量删除 </el-button>
+        </template>
+      </layout-table>
+    </layout-card>
+
+    <batchaddcard
+      v-model:visible="data.batchaddcardDialog.visible"
+      @get-data="fnGetDataTransfer"
+    />
+    <editcard
+      v-if="data.editDialog.visible"
+      v-model:visible="data.editDialog.visible"
+      v-model:form="data.editDialog.form"
+      @get-data="fnGetDataTransfer"
+    />
+  </div>
+</template>
+
+<script setup>
+import { serialNumber } from "@/assets/js/utils.js";
+import useListData from "@/assets/js/useListData.js";
+import batchaddcard from "./components/batchaddcard.vue";
+import editcard from "./components/editcard.vue";
+import {
+  getDeployCardList,
+  setRemoveDeployCardData,
+  setUnbindingDeployCardData,
+} from "@/request/positioning.js";
+import { reactive } from "vue";
+import { debounce } from "throttle-debounce";
+import { ElMessage, ElMessageBox } from "element-plus";
+
+const { list, pagination, searchForm, fnGetData, fnResetPagination, tableRef } =
+  useListData(getDeployCardList);
+
+const data = reactive({
+  batchaddcardDialog: {
+    visible: false,
+  },
+  editDialog: {
+    visible: false,
+    form: {}
+  },
+});
+const fnGetDataTransfer = () => {
+  fnGetData();
+};
+const fnEditDataInfo = (row) => {
+  data.editDialog.visible = true;
+  data.editDialog.form = row;
+
+};
+const batchUnbinding = debounce(
+  1000,
+  async () => {
+    const selectionData = tableRef.value.getSelectionRows();
+    if (selectionData.length === 0) {
+      ElMessage.warning("请选中要解绑的项");
+      return;
+    }
+    const DATA_IDS = selectionData.map((item) => item.cardNo).join(",");
+    await ElMessageBox.confirm("确定要解绑吗？", { type: "warning" });
+    await setUnbindingDeployCardData({ DATA_IDS });
+    ElMessage.success("解绑成功");
+    fnResetPagination();
+  },
+  { atBegin: true }
+);
+// 批量删除
+const batchDelete = debounce(
+  1000,
+  async () => {
+    const selectionData = tableRef.value.getSelectionRows();
+    if (selectionData.length === 0) {
+      ElMessage.warning("请选中要删除的项");
+      return;
+    }
+    const DATA_IDS = selectionData.map((item) => item.cardNo).join(",");
+    await ElMessageBox.confirm("确定要删除吗？", { type: "warning" });
+    await setRemoveDeployCardData({ DATA_IDS });
+    ElMessage.success("删除成功");
+    fnResetPagination();
+  },
+  { atBegin: true }
+);
+const fnResetPaginationTransfer = () => {
+  fnResetPagination();
+};
+</script>
+
+<style scoped></style>