人员管控

src/api/construction/manage/personManage.js

@@ -16,3 +16,30 @@ export function teamPersonByTower(query) {
         params: query
     })
 }
+
+/* 手环人脸验证抽检 */
+export function spotCheck(data) {
+    return request({
+        url: '/bracelet/consControl/spotCheck',
+        method: 'post',
+        data: data
+    })
+}
+
+/* 自动验证配置详情 */
+export function getCheckConfig(query) {
+    return request({
+        url: '/bracelet/consControl/getCheckConfig',
+        method: 'get',
+        params: query
+    })
+}
+
+/* 自动验证配置 */
+export function checkConfig(data) {
+    return request({
+        url: '/bracelet/consControl/checkConfig',
+        method: 'post',
+        data: data
+    })
+}

src/views/construction/manage/personManage/personManage.vue

@@ -1,11 +1,9 @@
 <template>
   <div class="personManage"
-    style="width: 100%;height: 80vh;background-color: #ffffff;box-shadow: 10px 10px 5px #000000;float: left;">
+    style="width: 100%;height: 80vh;background-color: #ffffff;box-shadow: 10px 10px 5px #000000;display: flex;">
     <div class="left">
-      <div class="title">
+      <el-input placeholder="请输入关键字" prefix-icon="el-icon-search" v-model="filterText" maxlength="30"
-        <el-input placeholder="请输入关键字" v-model="filterText" maxlength="30">
+        style="margin: 10px 0;"></el-input>
-        </el-input>
-      </div>
       <div class="content tree">
         <el-tree :data="treeData" icon="el-icon-search" node-key="id" :default-expanded-keys="idArr"
           @node-click="handleNodeClick" :render-content="renderContent" style="font-size: 15px;letter-spacing: 1px;"
@@ -15,7 +13,7 @@
     <div class="center">
       <div class="title">
         <el-button type="primary" plain icon="el-icon-search" @click="facialSampling">手环人脸验证抽检</el-button>
-        <el-button type="primary" plain icon="el-icon-setting" @click="dialogVisible2 = true">自动验证配置</el-button>
+        <el-button type="primary" plain icon="el-icon-setting" @click="getCheckConfigDetail">自动验证配置</el-button>
       </div>
       <div class="content">
         <baidu-map map-style-v2="light" class="map" :zoom="zoom" :center="center" @ready="handler">
@@ -66,63 +64,69 @@
 
 
     <el-dialog title="选择抽检范围" :visible.sync="dialogVisible1" :append-to-body="true" width="500px">
-      <el-input placeholder="请输入关键字" v-model="filterText2" maxlength="30" style="margin-bottom: 10px;"></el-input>
+      <el-input placeholder="请输入关键字" prefix-icon="el-icon-search" v-model="filterText2" maxlength="30"
-      <div class="tree">
+        style="margin-bottom: 10px;"></el-input>
-        <el-tree :data="teamTreeData" icon="el-icon-search" show-checkbox node-key="id" :default-expanded-keys="idArr2"
+      <el-tree :data="teamTreeData" class="tree-container tree" icon="el-icon-search" show-checkbox node-key="id"
-          @node-click="teamTreeNodeClick" :filter-node-method="filterNode2" style="letter-spacing: 1px;"
+        :default-expanded-keys="idArr2" @node-click="teamTreeNodeClick" :filter-node-method="filterNode2"
-          @check-change="teamTreeCheckChange" ref="teamTree" />
+        style="letter-spacing: 1px;" @check-change="teamTreeCheckChange" ref="teamTree" />
-      </div>
+      <div slot="footer" class="dialog-footer">
-      <template #footer>
-        <span class="dialog-footer">
-          <el-button @click="dialogVisible1 = false">取消</el-button>
         <el-button type="primary" @click="startSpotCheck">发起抽检</el-button>
-        </span>
+        <el-button @click="dialogVisible1 = false">取消</el-button>
-      </template>
+      </div>
     </el-dialog>
 
 
-    <el-dialog title="自动验证人脸配置" :visible.sync="dialogVisible2" :append-to-body="true" :draggable="true"
+    <el-dialog title="自动验证人脸配置" :visible.sync="dialogVisible2" :append-to-body="true" width="500px">
-      :destroy-on-close="true" width="20%" custom-class="my-dialog">
+      <el-form ref="form" :model="form" :label-position="labelPosition" :rules="rules">
-      <div style="width: 100%;height: 30vh;">
+        <el-form-item label="模式选择">
-        <div>模式选择</div>
+          <el-radio-group v-model="form.configType">
-        <el-radio-group v-model="provingTypeRadioValue" class="ml-4" @change="provingTypeRadioChange"
+            <el-radio label="1">固定时间验证</el-radio>
-          style="margin-top: 10px;">
+            <el-radio label="2">间隔时间验证</el-radio>
-          <el-radio label="1" size="large">固定时间验证</el-radio>
-          <el-radio label="2" size="large">间隔时间验证</el-radio>
           </el-radio-group>
-
+        </el-form-item>
-        <div v-if="provingTypeRadioValue == '1'">
+        <!--固定时间验证 -->
-          <div @click="addTimeInput" style="color: #1890FF;margin-top: 20px;margin-bottom: 10px;cursor: pointer;">+ 添加时间
+        <div v-if="form.configType == 1">
+          <el-form-item>
+            <el-button @click="addTimes"><i class="el-icon-plus"></i> 添加时间</el-button>
+          </el-form-item>
         </div>
-          <div style="overflow: auto;width: 100%;height: 22vh;">
+        <div v-if="form.configType == 1" class="item-arr">
-            <div v-for="(item, index) in provingTimeValue">
+          <el-form-item v-for="(time, index) in form.times" :key="time.key" :prop="'times.' + index + '.value'" :rules="{
-              <el-time-picker v-model="provingTimeValue[index]" format="HH:mm:ss" placeholder="选择时间"
+            required: true, message: '时间不能为空', trigger: 'blur'
-                value-format="HH-mm-ss" style="margin-bottom: 10px;">
+          }">
-              </el-time-picker>
+            <el-col :span="12">
-              <el-button v-if="index != 0" class="el-icon-delete" @click="delTimeInput(index)" />
+              <el-time-select v-model="time.value" :picker-options="{
+                start: '00:00',
+                step: '00:15',
+                end: '23:45'
+              }" placeholder="请选择时间">
+              </el-time-select>
+            </el-col>
+            <el-col :span="5" style="margin-left: 10px;">
+              <el-button type="danger" plain @click.prevent="removeTime(time)"><i
+                  class="el-icon-delete"></i></el-button>
+            </el-col>
+          </el-form-item>
         </div>
+        <!-- 间隔时间验证 -->
+        <div v-if="form.configType == 2" class="time">
+          <el-col :span="24">
+            每隔 <el-input-number v-model="form.timeNum" controls-position="right" @change="handleChange" :min="1"
+              :max="10"></el-input-number> 小时自动验证人脸
+          </el-col>
         </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确定</el-button>
+        <el-button @click="closeTimeConfig">取消</el-button>
       </div>
-        <div v-if="provingTypeRadioValue == '2'">
-          <div style="margin-top: 10%;margin-left: 30px;">
-            每隔&nbsp;<el-input v-model="intervalTime" type="number" min="1" style="width: 100px;" />&nbsp;小时自动验证人脸
-          </div>
-        </div>
-      </div>
-      <template #footer>
-        <span class="dialog-footer">
-          <el-button @click="provingDialogClose">取消</el-button>
-          <el-button type="primary" @click="provingDialogConfirm">确定</el-button>
-        </span>
-      </template>
     </el-dialog>
   </div>
 
 </template>
 
 <script>
-import { personsTree, teamPersonByTower } from "@/api/construction/manage/personManage.js";
+import { personsTree, teamPersonByTower, spotCheck, getCheckConfig, checkConfig } from "@/api/construction/manage/personManage.js";
-import { log } from '../../../../utils/video/video-7.19.1.min';
 export default {
   name: 'personManage',
   /* 人员树前端筛选 */
@@ -152,7 +156,23 @@ export default {
         label: 'label',
         disabled: 'disabled',
       },
-
+      /* 表单对齐样式 */
+      labelPosition: 'top',
+      // 表单参数
+      form: {
+        configType: '1',
+        times: [],
+        timeNum: 1
+      },
+      // 表单校验
+      rules: {
+        /*  teamId: [
+           { required: true, message: "请选择领用班组", trigger: "blur" }
+         ],
+         powerId: [
+           { required: true, message: "请选择作业杆塔编号", trigger: "blur" }
+         ], */
+      },
       //记录设备位置数据
       deviceData: [
         { "position": { lng: 116.404, lat: 39.915 }, "deviceName": "设备11", show: false, },
@@ -321,7 +341,7 @@ export default {
     /* 手环人脸验证抽检 */
     facialSampling() {
       if (!this.towerId) {
-        this.$message({
+        return this.$message({
           message: '请选择杆塔',
           type: 'warning'
         });
@@ -331,6 +351,66 @@ export default {
         this.dialogVisible1 = true;
       }
     },
+    // 自动验证配置详情
+    getCheckConfigDetail() {
+      getCheckConfig().then((res) => {
+        if (res.data && res.data.length > 0) {
+          const data = res.data;
+          const configType = data[0].configType + '';
+          if (configType === '1') {
+            data.forEach((item, index) => {
+              this.form.times.push({ value: item.time, key: Date.now() })
+            })
+          } else if (configType === '2') {
+            this.form.timeNum = parseInt(res.data[0].time);
+          }
+          this.form.configType = configType;
+        } else {
+          this.form.configType = '1';
+        }
+      }).catch((res) => {
+
+      })
+      this.dialogVisible2 = true;
+    },
+    // 模式选择为固定时间-添加多个时间
+    addTimes() {
+      const tiemsArr = this.form.times;
+      if (tiemsArr && tiemsArr.length >= 10) {
+        return this.$message({
+          message: '固定时间验证不能超过10个',
+          type: 'warning'
+        });
+      }
+      this.form.times.push({
+        value: '',
+        key: Date.now()
+      });
+    },
+    // 删除时间
+    removeTime(item) {
+      var index = this.form.times.indexOf(item)
+      if (index !== -1) {
+        this.form.times.splice(index, 1)
+      }
+    },
+    // 判断固定时间数组是否存在相同数据
+    isTimeRepeated(arr) {
+      const newArr = arr.map((item) => item.value);
+      const isRepeat = newArr.some((item, index, arr) => arr.indexOf(item) != index);
+      return isRepeat;
+    },
+    // 间隔时间验证空值赋值
+    handleChange(value) {
+      if (!value) {
+        this.form.timeNum = 1;
+      }
+    },
+    // 关闭自动验证配置
+    closeTimeConfig() {
+      this.form.times = [];
+      this.dialogVisible2 = false
+    },
     handler({ BMap, map }) {
       console.log(BMap, map);
       this.center.lng = 116.404;
@@ -429,49 +509,83 @@ export default {
     startSpotCheck() {
       //获取多选框勾选的值
       const checkedNodes = this.$refs.teamTree.getCheckedNodes();
-      console.log(checkedNodes);
+      if (!checkedNodes || checkedNodes.length == 0) {
-
+        return this.$message({
-
+          message: '请选择抽检班组人员',
-      // this.dialogVisible1 = false
+          type: 'warning'
+        });
+      }
+      let checkArr = [];
+      checkedNodes.forEach(item => {
+        console.error(item.parentId);
+        if (item.parentId !== -1 && item.parentId !== 0) {
+          checkArr.push({ "userId": item.id, "userType": item.userType, "devCode": item.devCode, "shCode": item.shCode })
+        }
+      });
+      if (checkArr.length == 0) {
+        return this.$message({
+          message: '请选择抽检班组人员！',
+          type: 'warning'
+        });
+      }
+      const obj = {
+        'spotCheckList': checkArr
+      }
+      spotCheck(obj).then((res) => {
+        this.$modal.msgSuccess(res.msg);
+        this.dialogVisible1 = false;
+      }).catch((res) => { })
     },
-
     //验证人脸配置单选按钮值改变监听
     provingTypeRadioChange(value) {
       console.log(value)
     },
-    //添加日期
-    addTimeInput() {
-      this.provingTimeValue.push('')
-    },
-    //删除日期
-    delTimeInput(index) {
-      this.provingTimeValue.splice(index, 1);
-    },
-
-
     //验证对话框关闭
     provingDialogClose() {
       this.dialogVisible2 = false;
     },
     //验证对话框确认按钮
-    provingDialogConfirm() {
+    submitForm: function () {
-      // provingTypeRadioValue intervalTime
+      this.$refs["form"].validate(valid => {
-      if (this.provingTypeRadioValue == "1") {
+        if (valid) {
-        console.log(this.provingTimeValue)
+          let obj = {};
+          if (this.form.configType === '1') {
+            // 固定时间
+            const timesArr = this.form.times;
+            if (!timesArr || timesArr.length == 0) {
+              return this.$message({
+                message: '未添加固定时间',
+                type: 'warning'
+              });
+            }
+            const isRepeat = this.isTimeRepeated(timesArr);
+            if (isRepeat) {
+              return this.$message({
+                message: '请勿添加相同的固定时间',
+                type: 'warning'
+              });
+            }
+            let timeArr = [];
+            this.form.times.forEach(item => {
+              timeArr.push(item.value);
+            })
+            obj.time = timeArr.toString();
           } else {
-        console.log(this.intervalTime)
+            // 间隔时间验证
+            obj.time = this.form.timeNum + '';
           }
-
+          obj.configType = this.form.configType;
-
+          checkConfig(obj).then((res) => {
+            this.$modal.msgSuccess(res.msg);
+            this.closeTimeConfig();
+          }).catch((res) => { });
         }
+      });
+    },
   }
 };
 </script>
 <style lang="scss" scoped>
-.my-dialog {
-  top: 200px
-}
-
 .map {
   display: inline-block;
   width: 100%;
@@ -487,19 +601,10 @@ export default {
 .personManage .left {
   width: 19.5%;
   height: 100%;
-  float: left;
   padding: 0 0.5%;
   box-sizing: border-box;
 }
 
-.personManage .left>.title {
-  width: 100%;
-  height: 8%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
 .personManage .left>.content {
   width: 100%;
   height: 92%;
@@ -509,14 +614,6 @@ export default {
   margin-left: 0.5%;
   width: 59.5%;
   height: 100%;
-  float: left;
-}
-
-.personManage .center>.title {
-  width: 100%;
-  height: 8%;
-  display: flex;
-  align-items: center;
 }
 
 .personManage .center>.content {
@@ -531,7 +628,7 @@ export default {
   margin-left: 0.5%;
   width: 20%;
   height: 100%;
-  float: left;
+  // float: left;
 }
 
 .personManage .right>.title {
@@ -545,44 +642,6 @@ export default {
   overflow: auto;
 }
 
-
-.dialog-footer button:first-child {
-  margin-right: 10px;
-}
-
-::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-/* 滚动槽 */
-
-::-webkit-scrollbar-track {
-  -webkit-box-shadow: inset 0 0 5px #e8eceb;
-  border-radius: 5px;
-}
-
-/* 滚动条滑块 */
-
-::-webkit-scrollbar-thumb {
-  border-radius: 10px;
-  background: #ffffff;
-  -webkit-box-shadow: inset 0 0 6px #cbb7b7;
-}
-
-::-webkit-scrollbar-thumb:window-inactive {
-  background: #e8eceb;
-}
-
-::-webkit-scrollbar-corner {
-  background-color: #e8eceb;
-}
-
-::v-deep .el-dialog {
-  height: 78vh;
-  overflow: auto;
-}
-
 /* tree节点过长换行处理 */
 .tree {
   width: 100%;
@@ -605,4 +664,16 @@ export default {
 ::v-deep .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
   color: #1890ff;
 }
+
+.tree-container {
+  max-height: 50vh;
+  overflow-y: auto;
+}
+
+.item-arr,
+.time {
+  min-height: 12vh;
+  max-height: 30vh;
+  overflow-y: auto;
+}
 </style>