新增门禁管理模块

package.json

@@ -63,6 +63,7 @@
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
     "vue-doc-preview": "^0.3.2",
+    "vue-horizontal-calendar": "^1.0.0",
     "vue-meta": "^2.4.0",
     "vue-pdf": "^4.3.0",
     "vue-quill-editor": "^3.0.6",

src/api/access/accessControl.js

@@ -0,0 +1,10 @@
+import request from '@/utils/request'
+
+// 查询门禁管理列表
+export function listBarracks(query) {
+  return request({
+    url: '/barracksManagement/barracks/list',
+    method: 'get',
+    params: query
+  })
+}

src/assets/styles/global.css

@@ -82,11 +82,6 @@
   color: white !important;
 }
 
-/* 设置表格颜色 */
-.el-table tr {
-  background: #00365F;
-  /* color: white; */
-}
 
 .pagination-container {
   background: #00365F !important;

src/components/look_word/bdgldiary.vue

@@ -551,41 +551,42 @@
         <tr
           class="JR_tr"
           style="font-family: '仿宋'"
-          v-for="(item, i) in message.bdglLeaves"
+          v-for="(item, i) in message.bdglDiaryLeaveList"
           :key="i + '   '"
         >
           <td class="JR_right">
-            <p align="center">{{ item.peopleName }}</p>
+            <p align="center">{{ item.name }}</p>
           </td>
           <td class="JR_right">
             <p align="center">
-              <dict-tag :options="dict.type.post_Level" :value="item.postId" />
+              {{ item.job }}
+              <!-- <dict-tag :options="dict.type.post_Level" :value="item.postId" /> -->
             </p>
           </td>
           <td class="JR_right" colspan="2">
-            <p align="center">{{ item.leaveReason }}</p>
+            <p align="center">{{ item.reason }}</p>
           </td>
           <td class="JR_right" colspan="1">
-            <p align="center">{{ time[i] }}</p>
+            <p align="center">{{ item.leaveDuration }}</p>
           </td>
           <td class="JR_right" colspan="2">
-            <p align="center">{{ item.peopleName1 }}</p>
+            <p align="center">{{ item.leaveApprover }}</p>
           </td>
           <td class="JR_right" colspan="2">
-            <p align="center">{{ item.departureTime }}</p>
+            <p align="center">{{ item.leaveTime }}</p>
           </td>
           <td class="JR_right" colspan="2">
-            <p align="center">{{ item.returnTime }}</p>
+            <p align="center">{{ item.backTime }}</p>
           </td>
           <td class="JR_right" colspan="3">
-            <p align="center">{{ guiTime[i] }}</p>
+            <p align="center">{{ item.overTime }}</p>
           </td>
         </tr>
         <tr
           class="JR_tr"
           height="30"
           style="font-family: '仿宋'"
-          v-for="i in qingjia.list"
+          v-for="i in num"
           :key="i + '    '"
         >
           <td class="JR_right"></td>
@@ -599,6 +600,7 @@
           <td class="JR_right" colspan="2"></td>
           <td class="JR_right" colspan="3"></td>
         </tr>
+
         <!-- 上级通知 -->
         <tr class="JR_tr">
           <td
@@ -720,6 +722,7 @@ export default {
                 .JR_right{ font-size: 1em; font-family: 仿宋_GB2312_GB2312;}
                 `,
       },
+      num: 0,
     };
   },
   created() {
@@ -731,6 +734,12 @@ export default {
     this.qingjias();
     this.xunlians();
     this.xunlianRen();
+    console.log(this.message);
+    if (this.message.bdglDiaryLeaveList.length >= 6) {
+      this.num = 0;
+    } else {
+      this.num = 7 - this.message.bdglDiaryLeaveList.length;
+    }
   },
   mounted() {},
 

src/views/access/Renaccess/index.vue

@@ -0,0 +1,392 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <vue-horizontal-calendar
+        :minDate="starttimes"
+        :maxDate="endtimes"
+        choosedDatePos="center"
+        :highlightedDates="year"
+        v-on:change="dateChange2"
+      ></vue-horizontal-calendar>
+      <el-form-item> </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8"> </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="bdglevenList"
+      :header-cell-style="{ background: '#003C69', color: 'white' }"
+    >
+      <!-- <el-table-column label="序号" align="center" prop="id" /> -->
+      <el-table-column label="序号" type="index" width="50" align="center">
+        <template scope="scope">
+          <span>{{
+            (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="编号" align="center" prop="pin" />
+      <el-table-column label="姓名" align="center" prop="name" />
+      <el-table-column
+        label="单位"
+        align="center"
+        prop="deptname"
+        show-overflow-tooltip
+      />
+      <el-table-column label="手机号码" align="center" prop="mobile" />
+      <el-table-column label="办公电话" align="center" prop="telephone" />
+      <el-table-column label="状态" align="center" prop="status">
+        <template slot-scope="scope">
+          <span v-if="scope.row.status == 0">在职</span>
+          <span v-else>离职</span>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template> 
+<script>
+import axios from "axios";
+// 导入树形结构
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+//日期
+import VueHorizontalCalendar from "vue-horizontal-calendar";
+export default {
+  name: "access",
+  components: {
+    Treeselect,
+    VueHorizontalCalendar,
+  },
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        number: 0,
+        pageNum: 1,
+        pageSize: 10,
+      },
+      bdglevenList: [],
+      // 显示搜索条件
+      showSearch: true,
+      // 遮罩层
+      loading: false,
+      // 总条数
+      total: 0,
+      //   人员数据
+      renList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      form: {},
+      rules: {
+        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
+        email: [
+          { required: true, message: "请输入邮箱地址", trigger: "blur" },
+          {
+            type: "email",
+            message: "请输入正确的邮箱地址",
+            trigger: ["blur", "change"],
+          },
+        ],
+      },
+      // 树形结构列表
+      deptOptions: [],
+      //year: ["2022/10/31"],
+      year: [],
+      //当月第一天
+      starttimes: null,
+      //当月最后一天
+      endtimes: null,
+      // new date
+      xinDate: null,
+    };
+  },
+  created() {
+    // // 获取列表
+    this.getTiem();
+  },
+  methods: {
+    dateChange2(day) {
+      this.year=[];
+      let date = new Date(day.timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+      let Y = date.getFullYear() + "-";
+      let M =
+        (date.getMonth() + 1 < 10
+          ? "0" + (date.getMonth() + 1)
+          : date.getMonth() + 1) + "-";
+      let D =
+        (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
+      let h =
+        (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":";
+      let m =
+        (date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()) +
+        ":";
+      let s =
+        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
+      var qian = Y + M + D + h + m + s;
+      this.xinDate = qian;
+      // console.log(qian);
+      var hou = Y + M + D + "23:59:59";
+      this.yearFn();
+      this.getList(qian, hou);
+    },
+    // 计算已经过去的日期
+    yearFn() {
+      //date1：开始日期，date2结束日期
+      var a1 = Date.parse(new Date(this.starttimes));
+      var a2 = Date.parse(new Date(this.xinDate));
+      var day = parseInt((a2 - a1) / (1000 * 60 * 60 * 24)); //核心：时间戳相减，然后除以天数
+      var R = 0;
+      // console.log(day);
+      var a3 = new Date();
+      let Y = a3.getFullYear();
+      let M =
+        a3.getMonth() + 1 < 10 ? "0" + (a3.getMonth() + 1) : a3.getMonth() + 1;
+      for (let index = 1; index <= day; index++) {
+        R = index < 10 ? "0" + index : index;
+        this.year.push(`${Y}/${M}/${R}`);
+      }
+      // console.log(Y, M);
+
+      // this.year = ["2022/10/01", "2022/10/02", "2022/10/03", "2022/10/04"];
+    },
+    // 获取当月的时间
+    getTiem() {
+      var date = new Date();
+      // 当月第一天
+      var firstDay = date.setDate(1);
+      // 当月最后一天
+      const currentMonth = date.getMonth();
+      const nextMonth = currentMonth + 1;
+      const nextMonthFirstDay = new Date(date.getFullYear(), nextMonth, 1);
+      var lastDay = new Date(nextMonthFirstDay);
+      // 当月第一天
+      this.starttimes =
+        new Date(firstDay).toISOString().slice(0, 10) + " " + "00:00:00";
+      // console.log(this.starttimes);
+      // 当月最后一天
+      this.endtimes =
+        new Date(lastDay).toISOString().slice(0, 10) + " " + "23:59:50";
+    },
+    // 获取列表
+    getList(starttime, endtime, number) {
+      this.loading = true;
+      axios
+        .post(
+          "http://192.168.5.188:85/api/v2/transaction/get/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+          {
+            starttime,
+            endtime,
+          }
+        )
+        .then((res) => {
+          this.loading = false;
+          this.bdglevenList = res.data.data.items;
+          this.total = res.data.data.items.length;
+        });
+    },
+  },
+};
+</script>
+  <style scoped>
+/* 对话框背景颜色 */
+::v-deep .el-dialog {
+  background: #004d86 !important;
+  width: 800px !important;
+}
+::v-deep .el-textarea__inner {
+  width: 920px;
+  height: 104px;
+  margin: auto;
+}
+::v-deep .el-dialog__header {
+  border-bottom: 1px solid #718a9d;
+}
+::v-deep .el-dialog__title {
+  color: #fff;
+  font: 18px;
+}
+::v-deep .el-dialog__headerbtn .el-dialog__close {
+  color: #fff;
+}
+::v-deep .el-form-item__label {
+  font: 16px;
+  color: #fff;
+  width: 100px !important;
+}
+::v-deep .el-input__inner {
+  /* width: 200px !important;
+    height: 36px; */
+  background: transparent;
+  color: #fff;
+  border: 1px solid white !important;
+}
+/* 基本信息背景 */
+.jiben {
+  width: 720px;
+  height: 32px;
+  background-image: url(../../../images/小标题底.png);
+  background-size: 100%;
+  margin-bottom: 25px;
+  color: #fff;
+  padding-left: 16px;
+  line-height: 32px;
+}
+/*调整表单间距 */
+::v-deep .el-form-item__content {
+  width: 200px;
+}
+::v-deep .el-input__inner {
+  cursor: pointer !important;
+}
+/* 底部确定取消按钮 */
+::v-deep .el-dialog__footer {
+  padding: 18px 50px !important;
+  margin-right: 77px !important;
+}
+::v-deep .el-dialog__body {
+  margin: 10px 0px 20px 51px;
+  padding-top: 20px !important;
+  box-sizing: border-box;
+  /* padding: 30px 12px 30px 28px; */
+}
+.contents {
+  padding: 0px 40px !important;
+}
+/* 下拉菜单 */
+.el-dropdown-link {
+  cursor: pointer;
+  color: #409eff;
+}
+.el-icon-arrow-down {
+  font-size: 12px;
+}
+/* 下拉菜单字体/背景颜色 */
+.el-select-dropdown__item.hover,
+.el-select-dropdown__item:hover {
+  background-color: #004d86;
+  color: #111;
+}
+.el-select-dropdown__item {
+  color: #111;
+}
+/* 时间选择 */
+::v-deep .el-input--small .el-input__inner {
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+}
+.el-date-editor.el-input {
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+}
+::v-deep .el-date-editor.el-input .el-input__inner {
+  height: 36px;
+  line-height: 36px;
+}
+/* 单位框背景颜色 */
+::v-deep .vue-treeselect__control {
+  background: transparent !important;
+  color: #fff;
+}
+/* 单位下拉菜单选中字体颜色 */
+::v-deep .vue-treeselect__single-value {
+  color: #fff !important;
+}
+/* 分页按钮 */
+::v-deep .el-pagination.is-background .el-pager li {
+  background-color: #004d86;
+  color: #fff;
+}
+::v-deep .el-pagination.is-background .btn-next {
+  background-color: #004d86;
+  color: #fff;
+}
+/* 底部确定取消按钮 */
+::v-deep .el-dialog__footer {
+  padding: 18px 50px;
+  margin-right: 42px;
+}
+::v-deep .el-dialog__body {
+  padding: none !important;
+}
+/* 小手样式 */
+::v-deep .el-table__cell {
+  cursor: pointer;
+}
+.el-button--mini {
+  width: 80px !important;
+  border: 1px solid transparent;
+  padding: 3px 8px;
+  font-size: 14px;
+  line-height: 1.5;
+  border-radius: 3px;
+  color: #fff;
+  background-color: #1890ff;
+}
+::v-deep .el-table .el-table__body .el-table__row.hover-row td {
+  background-color: #004d86;
+}
+::v-deep .el-table__fixed-right {
+  height: 100% !important;
+}
+::v-deep .box {
+  background-color: #ffba00 !important;
+}
+::v-deep .el-input.is-disabled .el-input__inner {
+  background-color: transparent;
+  color: #fff;
+}
+
+/* 日历样式 */
+::v-deep .horizontal-calendar {
+  border-top: 1px solid rgb(0, 60, 105) !important;
+}
+::v-deep .horizontal-calendar {
+  border-bottom: 1px solid rgb(0, 60, 105);
+  background-color: rgb(0, 60, 105);
+}
+::v-deep .horizontal-calendar .date-item {
+  background-color: transparent;
+  border-right: 1px solid rgb(0, 60, 105);
+}
+::v-deep .horizontal-calendar .date-item-date {
+  color: #fff;
+}
+::v-deep .horizontal-calendar .date-item-day {
+  color: #fff !important;
+}
+::v-deep .horizontal-calendar .left-arrow {
+  background-color: transparent;
+  border-left: 1px solid rgb(0, 60, 105) !important;
+  border-right: 1px solid rgb(0, 60, 105) !important;
+}
+::v-deep .horizontal-calendar .right-arrow {
+  background-color: transparent;
+  border-left: 1px solid rgb(0, 60, 105) !important;
+  border-right: 1px solid rgb(0, 60, 105) !important;
+}
+::v-deep .horizontal-calendar .left-arrow:hover {
+  background-color: rgb(0, 60, 105) !important;
+}
+::v-deep .horizontal-calendar .right-arrow:hover {
+  background-color: rgb(0, 60, 105) !important;
+}
+::v-deep .horizontal-calendar .icon {
+  color: #fff;
+}
+::v-deep .date-highlighted {
+  background: rgba(255,255,0,.5) !important;
+  border-right: 1px solid rgba(255,255,0,.1) !important;
+}
+</style>
+  
+    

src/views/access/accessControl/index.vue

@@ -0,0 +1,248 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item prop="starttime">
+        <el-date-picker
+          clearable
+          size="small"
+          v-model="queryParams.starttime"
+          type="datetime"
+          placeholder="请选择开始时间"
+          @change="handleQuery"
+          value-format="yyyy-MM-dd HH:mm:ss"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item prop="endtime">
+        <el-date-picker
+          clearable
+          size="small"
+          v-model="queryParams.endtime"
+          type="datetime"
+          placeholder="请选择结束时间"
+          @change="handleQuery"
+          value-format="yyyy-MM-dd HH:mm:ss"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button size="btr" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8"> </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="bdglevenList"
+      :header-cell-style="{ background: '#003C69', color: 'white' }"
+    >
+      <!-- <el-table-column label="序号" align="center" prop="id" /> -->
+      <el-table-column label="序号" type="index" width="50" align="center">
+        <template scope="scope">
+          <span>{{
+            (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="编号" align="center" prop="pin" />
+      <el-table-column label="姓名" align="center" prop="ename" />
+      <el-table-column
+        label="单位"
+        align="center"
+        prop="deptname"
+        show-overflow-tooltip
+      />
+      <el-table-column label="时间" align="center" prop="checktime">
+      </el-table-column>
+      <el-table-column label="设备编号" align="center" prop="sn" />
+      <!-- <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+        width="200"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="btk"
+            type="text"
+            @click="handleChakan(scope.row)"
+            v-hasPermi="['grassrootsregistration:bdgldiary:edit']"
+            ><span class="chakan">查看</span></el-button
+          >
+        </template>
+      </el-table-column> -->
+    </el-table>
+  </div>
+</template>
+
+<script>
+import axios from "axios";
+export default {
+  name: "access",
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        number: 10,
+        pageNum:1,
+        pageSize: 10,
+      },
+      bdglevenList: [],
+      // 显示搜索条件
+      showSearch: true,
+      // 遮罩层
+      loading: false,
+      // 总条数
+      total: 0,
+    };
+  },
+  created() {
+    this.getTiem();
+  },
+  methods: {
+    // 获取当月的时间
+    getTiem() {
+      var date = new Date();
+      // 当月第一天
+      var firstDay = date.setDate(1);
+      // 当月最后一天
+      const currentMonth = date.getMonth();
+      const nextMonth = currentMonth + 1;
+      const nextMonthFirstDay = new Date(date.getFullYear(), nextMonth, 1);
+      var lastDay = new Date(nextMonthFirstDay);
+      var starttimes =
+        new Date(firstDay).toISOString().slice(0, 10) + " " + "00:00:00";
+      var endtimes =
+        new Date(lastDay).toISOString().slice(0, 10) + " " + "23:50:00";
+      // console.log(starttimes, endtimes);
+      this.getList(starttimes, endtimes);
+    },
+    handleQuery() {
+      this.getList(this.queryParams.starttime,this.queryParams.endtime,)
+    },
+    // 重置
+    resetQuery() {
+      this.getTiem()
+      this.queryParams.starttime="";
+      this.queryParams.endtime="";
+    },
+    getList(starttime, endtime, number) {
+      this.loading = true;
+      axios
+        .post(
+          "http://192.168.5.188:85/api/v2/transaction/get/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+          {
+            starttime,
+            endtime,
+          }
+        )
+        .then((res) => {
+          this.loading = false;
+          this.bdglevenList = res.data.data.items;
+          this.total = res.data.data.items.length;
+        });
+    },
+  },
+};
+</script>
+<style scoped>
+/* 对话框背景颜色 */
+::v-deep .el-dialog {
+  width: 1016px !important;
+  background: #004d86 !important;
+}
+::v-deep .el-textarea__inner {
+  width: 882px;
+  height: 104px;
+}
+::v-deep .el-dialog__header {
+  border-bottom: 1px solid #718a9d;
+}
+::v-deep .el-dialog__title {
+  color: #fff;
+  font: 18px;
+}
+::v-deep .el-dialog__headerbtn .el-dialog__close {
+  color: #fff;
+}
+::v-deep .el-form-item__label {
+  font: 16px;
+  color: #fff;
+  width: 100px !important;
+}
+::v-deep .el-input__inner {
+  background: transparent;
+  color: #fff;
+  border: 1px solid white !important;
+  border-color: #fff !important;
+}
+/* 单位框背景颜色 */
+::v-deep .vue-treeselect__control {
+  background: #004d86 !important;
+}
+/*调整表单间距 */
+::v-deep .el-form-item__content {
+  width: 200px;
+}
+
+::v-deep .el-dialog__body {
+  /* margin: 0px 20px; */
+  box-sizing: border-box;
+  padding: 30px 0px 30px 42px;
+}
+/* 刷新图标 */
+/* .el-icon-refresh {
+  width: 76px;
+  height: 36px;
+  color: #fff;
+  background-color: #1d96ff !important;
+  border-radius: 4px;
+  border: none;
+  margin-left: 20px;
+  font-size: 14px;
+} */
+/* 下拉菜单字体/背景颜色 */
+/* .el-select-dropdown__item.hover,
+.el-select-dropdown__item:hover {
+  background-color: #004d86;
+  color: #fff;
+} */
+/* .el-select-dropdown__item {
+  color: #fff;
+} */
+/* 时间选择 */
+::v-deep .el-input--small .el-input__inner {
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+}
+.el-date-editor.el-input {
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+}
+::v-deep .el-date-editor.el-input .el-input__inner {
+  height: 36px;
+  line-height: 36px;
+}
+
+/* 调整输入框提示文字颜色 */
+::v-deep .vue-treeselect__placeholder {
+  color: #bdbdbd4f !important;
+}
+::v-deep input::-webkit-input-placeholder {
+  color: #bdbdbd4f !important;
+}
+::v-deep input:-moz-placeholder {
+  color: #bdbdbd4f !important;
+}
+::v-deep .el-select__input {
+  color: #fff !important;
+}
+</style>

src/views/access/renInformation/index.vue

@@ -0,0 +1,510 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item prop="offduty">
+        <el-select
+          v-model="queryParams.offduty"
+          placeholder="请选择是否在职"
+          clearable
+        >
+          <el-option
+            v-for="item in renList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button size="btr" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row :gutter="10" class="mb8"> </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="bdglevenList"
+      :header-cell-style="{ background: '#003C69', color: 'white' }"
+    >
+      <!-- <el-table-column label="序号" align="center" prop="id" /> -->
+      <el-table-column label="序号" type="index" width="50" align="center">
+        <template scope="scope">
+          <span>{{
+            (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="编号" align="center" prop="pin" />
+      <el-table-column label="姓名" align="center" prop="name" />
+      <el-table-column
+        label="单位"
+        align="center"
+        prop="deptname"
+        show-overflow-tooltip
+      />
+      <el-table-column label="手机号码" align="center" prop="mobile" />
+      <el-table-column label="办公电话" align="center" prop="telephone" />
+      <el-table-column label="状态" align="center" prop="status">
+        <template slot-scope="scope">
+          <span v-if="scope.row.status == 0">在职</span>
+          <span v-else>离职</span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+        width="200"
+      >
+        <template slot-scope="scope">
+          <el-button size="btu" type="text" @click="handleUpdate(scope.row)"
+            ><span class="chakan">修改</span></el-button
+          >
+
+          <el-button size="btk" type="text" @click="handleChakan(scope.row)"
+            ><span class="chakan">删除</span></el-button
+          >
+        </template>
+      </el-table-column> -->
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+    <!-- 修改人员对话框 -->
+    <el-dialog
+      :title="title"
+      :visible.sync="open"
+      width="500px"
+      append-to-body
+      :close-on-click-modal="false"
+    >
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+        inline
+      >
+        <div class="jiben">基本信息</div>
+        <el-form-item label="人员编号" prop="pin">
+          <el-input v-model="form.pin" placeholder="" />
+        </el-form-item>
+        <el-form-item label="单位" prop="deptnumber">
+          <treeselect
+            v-model="form.deptnumber"
+            :options="deptOptions"
+            placeholder=""
+          />
+        </el-form-item>
+
+        <el-form-item label="姓名" prop="name">
+          <el-input v-model="form.name" placeholder="" />
+        </el-form-item>
+        <el-form-item label="性别" prop="leaveType">
+          <el-select v-model="form.leaveReason" placeholder="" clearable>
+            <el-option
+              v-for="item in sixList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="手机号码" prop="mobile">
+          <el-input v-model="form.mobile" placeholder="" />
+        </el-form-item>
+        <el-form-item label="办公电话" prop="telephone">
+          <el-input v-model="form.telephone" placeholder="" />
+        </el-form-item>
+        <el-form-item label="人员卡号" prop="Card">
+          <el-input v-model="form.Card" placeholder="" />
+        </el-form-item>
+        <el-form-item label="邮箱" prop="email">
+          <el-input v-model="form.email" placeholder="" />
+        </el-form-item>
+        <el-form-item label="是否在职" prop="status">
+          <el-select v-model="form.status" placeholder="" clearable>
+            <el-option
+              v-for="item in renLiList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel" size="btn">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+  
+  <script>
+import axios from "axios";
+import { getDicts } from "@/api/system/dict/data";
+import { getDept } from "@/api/grassrootsregistration/bdglmeeting";
+// 导入树形结构
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+export default {
+  name: "access",
+  components: {
+    Treeselect,
+  },
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        number: 0,
+        pageNum: 1,
+        pageSize: 10,
+      },
+      bdglevenList: [],
+      // 显示搜索条件
+      showSearch: true,
+      // 遮罩层
+      loading: false,
+      // 总条数
+      total: 0,
+      //   人员数据
+      renList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      form: {},
+      rules: {
+        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
+        email: [
+          { required: true, message: "请输入邮箱地址", trigger: "blur" },
+          {
+            type: "email",
+            message: "请输入正确的邮箱地址",
+            trigger: ["blur", "change"],
+          },
+        ],
+      },
+      // 树形结构列表
+      deptOptions: [],
+      //人员离职列表
+      renLiList: [
+        {
+          name: "在职",
+          id: 0,
+        },
+        {
+          name: "离职",
+          id: 1,
+        },
+      ],
+      //性别列表
+      sixList: [
+        {
+          id: "M",
+          name: "男",
+        },
+        {
+          id: "F",
+          name: "女",
+        },
+      ],
+    };
+  },
+  created() {
+    // 获取列表
+    this.getTiem();
+    // 字典在位情况
+    getDicts("sys_zai").then((res) => {
+      this.renList = res.data;
+    });
+  },
+  methods: {
+    // 表单重置
+    reset() {
+      this.form = {};
+      this.resetForm("form");
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset()
+    },
+    /** 提交按钮 */
+    submitForm() {
+      var arr = [];
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          this.form.cardno = this.form.Card;
+          arr.push(this.form);
+          axios
+            .post(
+              "http://192.168.5.188:85/api/v2/employee/update/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+              arr
+            )
+            .then((res) => {
+              this.$message.success("修改成功");
+              this.getTiem();
+              this.open = false;
+            })
+            .catch(function (error) {
+              this.$message.error(error);
+            });
+        }
+      });
+    },
+    // 获取部门列表
+    getBuMeng() {
+      getDept().then((res) => {
+        this.deptOptions = res.data;
+      });
+    },
+    // 修改人员信息弹出框
+    handleUpdate(row) {
+      var pin = row.pin;
+      var cardno = "";
+      this.getBuMeng();
+      axios
+        .post(
+          "http://192.168.5.188:85/api/v2/employee/get/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+          {
+            pinlist: pin,
+          }
+        )
+        .then((res) => {
+          this.form = res.data.data.items[0];
+          this.open = true;
+          this.title = "修改人员信息";
+        });
+    },
+    //   获取人员
+    getTiem() {
+      this.getList(this.queryParams.number);
+    },
+    handleQuery() {
+      this.getList(
+        this.queryParams.starttime,
+        this.queryParams.endtime,
+        this.queryParams.number
+      );
+    },
+    // 重置
+    resetQuery() {
+      this.getTiem();
+      this.queryParams.starttime = "";
+      this.queryParams.endtime = "";
+    },
+    getList(number) {
+      this.loading = true;
+      axios
+        .post(
+          "http://192.168.5.188:85/api/v2/employee/get/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+          {
+            number,
+          }
+        )
+        .then((res) => {
+          this.loading = false;
+          this.bdglevenList = res.data.data.items;
+          this.total = res.data.data.items.length;
+        });
+    },
+    // 删除人员
+    handleChakan(row) {
+      var pin = row.pin;
+      axios
+        .post(
+          "http://192.168.5.188:85/api/v2/EnrollPic/delete/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+          {
+            pin,
+          }
+        )
+        .then(() => {
+          this.$message.success("删除人员成功1");
+          axios
+            .post(
+              "http://192.168.5.188:85/api/v2/employee/delete/?key=2633p84hnnlavzcy9afjcbtj1jdnega0ftscjkka6h7a",
+              {
+                pin,
+              }
+            )
+            .then(() => {
+              this.$message.success("删除人员成功");
+              this.getTiem();
+            });
+        });
+    },
+  },
+};
+</script>
+<style scoped>
+/* 对话框背景颜色 */
+::v-deep .el-dialog {
+  background: #004d86 !important;
+  width: 800px !important;
+}
+::v-deep .el-textarea__inner {
+  width: 920px;
+  height: 104px;
+  margin: auto;
+}
+::v-deep .el-dialog__header {
+  border-bottom: 1px solid #718a9d;
+}
+::v-deep .el-dialog__title {
+  color: #fff;
+  font: 18px;
+}
+::v-deep .el-dialog__headerbtn .el-dialog__close {
+  color: #fff;
+}
+::v-deep .el-form-item__label {
+  font: 16px;
+  color: #fff;
+  width: 100px !important;
+}
+::v-deep .el-input__inner {
+  /* width: 200px !important;
+  height: 36px; */
+  background: transparent;
+  color: #fff;
+  border: 1px solid white !important;
+}
+/* 基本信息背景 */
+.jiben {
+  width: 720px;
+  height: 32px;
+  background-image: url(../../../images/小标题底.png);
+  background-size: 100%;
+  margin-bottom: 25px;
+  color: #fff;
+  padding-left: 16px;
+  line-height: 32px;
+}
+/*调整表单间距 */
+::v-deep .el-form-item__content {
+  width: 200px;
+}
+::v-deep .el-input__inner {
+  cursor: pointer !important;
+}
+/* 底部确定取消按钮 */
+::v-deep .el-dialog__footer {
+  padding: 18px 50px !important;
+  margin-right: 77px !important;
+}
+::v-deep .el-dialog__body {
+  margin: 10px 0px 20px 51px;
+  padding-top: 20px !important;
+  box-sizing: border-box;
+  /* padding: 30px 12px 30px 28px; */
+}
+.contents {
+  padding: 0px 40px !important;
+}
+/* 下拉菜单 */
+.el-dropdown-link {
+  cursor: pointer;
+  color: #409eff;
+}
+.el-icon-arrow-down {
+  font-size: 12px;
+}
+/* 下拉菜单字体/背景颜色 */
+.el-select-dropdown__item.hover,
+.el-select-dropdown__item:hover {
+  background-color: #004d86;
+  color: #111;
+}
+.el-select-dropdown__item {
+  color: #111;
+}
+/* 时间选择 */
+::v-deep .el-input--small .el-input__inner {
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+}
+.el-date-editor.el-input {
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+}
+::v-deep .el-date-editor.el-input .el-input__inner {
+  height: 36px;
+  line-height: 36px;
+}
+/* 单位框背景颜色 */
+::v-deep .vue-treeselect__control {
+  background: transparent !important;
+  color: #fff;
+}
+/* 单位下拉菜单选中字体颜色 */
+::v-deep .vue-treeselect__single-value {
+  color: #fff !important;
+}
+/* 分页按钮 */
+::v-deep .el-pagination.is-background .el-pager li {
+  background-color: #004d86;
+  color: #fff;
+}
+::v-deep .el-pagination.is-background .btn-next {
+  background-color: #004d86;
+  color: #fff;
+}
+/* 底部确定取消按钮 */
+::v-deep .el-dialog__footer {
+  padding: 18px 50px;
+  margin-right: 42px;
+}
+::v-deep .el-dialog__body {
+  padding: none !important;
+}
+/* 小手样式 */
+::v-deep .el-table__cell {
+  cursor: pointer;
+}
+.el-button--mini {
+  width: 80px !important;
+  border: 1px solid transparent;
+  padding: 3px 8px;
+  font-size: 14px;
+  line-height: 1.5;
+  border-radius: 3px;
+  color: #fff;
+  background-color: #1890ff;
+}
+/* ::v-deep .el-table__body tr.hover-row > td.el-table__cell {
+  background-color: none;
+} */
+::v-deep .el-table .el-table__body .el-table__row.hover-row td {
+  background-color: #004d86;
+}
+::v-deep .el-table__fixed-right {
+  height: 100% !important;
+}
+::v-deep .box {
+  background-color: #ffba00 !important;
+}
+::v-deep .el-input.is-disabled .el-input__inner {
+  background-color: transparent;
+  color: #fff;
+}
+</style>
+
+  

src/views/pt.vue

@@ -229,7 +229,12 @@
             </li>
             <li v-if="str.includes('门禁管理') || str.includes('admin')">
               <div class="demo-box">
-                <div class="demo active" id="a2" data-url="/diary?ref=addtabs">
+                <div
+                  class="demo active"
+                  id="a2"
+                  data-url="/diary?ref=addtabs"
+                  v-on:click="mengJinFun"
+                >
                   <img src="../images/mj.png" alt />
                 </div>
               </div>
@@ -967,6 +972,12 @@ export default {
         .catch(() => {});
       Cookies.set("shuaxin", "false");
     },
+    mengJinFun() {
+      this.$router
+        .push({ path: "/index", query: { name: "/access" } })
+        .catch(() => {});
+      Cookies.set("shuaxin", "false");
+    },
     yingjufun() {
       this.$router
         .push({ path: "/index", query: { name: "/materialManagement" } })