From c0efa47d1fac1fef4e5557133783332a9028d6a6 Mon Sep 17 00:00:00 2001
From: xiayuping666 <1269237624@qq.com>
Date: Fri, 26 Apr 2024 18:02:23 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=84=E5=88=99=E5=AF=B9=E6=8E=A5=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/admin.js                               |  15 +
 src/i18n/lang/en.js                           |   1 +
 src/i18n/lang/zh-cn.js                        |   3 +-
 src/i18n/lang/zh-tw.js                        |   2 +
 src/views/classList/classList/index.vue       |  92 ++-
 src/views/department/index.vue                |   2 +
 src/views/regulation/api.js                   |  69 +++
 src/views/regulation/columns.js               |  52 ++
 .../regulation/components/CommonHead.vue      |  75 +++
 .../regulation/components/CommonTablesImg.vue | 115 ++++
 src/views/regulation/index.vue                | 573 ++++++++++++++++++
 11 files changed, 995 insertions(+), 4 deletions(-)
 create mode 100644 src/views/regulation/api.js
 create mode 100644 src/views/regulation/columns.js
 create mode 100644 src/views/regulation/components/CommonHead.vue
 create mode 100644 src/views/regulation/components/CommonTablesImg.vue
 create mode 100644 src/views/regulation/index.vue

diff --git a/public/admin.js b/public/admin.js
index c538f00..c027175 100644
--- a/public/admin.js
+++ b/public/admin.js
@@ -638,5 +638,20 @@ export default {
 				icon: 'el-icon-collection',
 			},
 		},
+		{
+			path: '/regulation',
+			name: 'regulation',
+			component: 'regulation',
+			meta: {
+				title: 'message.router.regulation',
+				isLink: '',
+				isHide: false,
+				isKeepAlive: true,
+				isAffix: false,
+				isIframe: false,
+				roles: ['admin', 'common'],
+				icon: 'el-icon-collection',
+			},
+		},
 	],
 };
diff --git a/src/i18n/lang/en.js b/src/i18n/lang/en.js
index a9f6144..f2fabca 100644
--- a/src/i18n/lang/en.js
+++ b/src/i18n/lang/en.js
@@ -58,6 +58,7 @@ export default {
 		evaluate: 'evaluate',
 		classList: 'classList',
 		department: 'department',
+		regulation: 'regulation'
 	},
 	staticRoutes: {
 		signIn: 'signIn',
diff --git a/src/i18n/lang/zh-cn.js b/src/i18n/lang/zh-cn.js
index f8f7aae..fea3294 100644
--- a/src/i18n/lang/zh-cn.js
+++ b/src/i18n/lang/zh-cn.js
@@ -57,7 +57,8 @@ export default {
 		recipe: '每周食谱',
 		evaluate: '幼儿评价表',
 		classList: '班级管理',
-		department: '部门管理'
+		department: '部门管理',
+		regulation: '规则管理'
 
 	},
 	staticRoutes: {
diff --git a/src/i18n/lang/zh-tw.js b/src/i18n/lang/zh-tw.js
index 3cb501d..27132ae 100644
--- a/src/i18n/lang/zh-tw.js
+++ b/src/i18n/lang/zh-tw.js
@@ -58,6 +58,8 @@ export default {
 		evaluate: '幼儿评价表',
 		classList: '班级管理',
 		department: '部门管理',
+		regulation: '规则管理',
+		
 	},
 	staticRoutes: {
 		signIn: '登入',
diff --git a/src/views/classList/classList/index.vue b/src/views/classList/classList/index.vue
index d673266..fed75e3 100644
--- a/src/views/classList/classList/index.vue
+++ b/src/views/classList/classList/index.vue
@@ -35,6 +35,8 @@
             <!-- <div  v-else style="margin-right: 10px; font-size: 16px;  line-height: 27px;font-weight: 700;">{{ classData.className}}</div> -->
             <el-button @click="onClickUpdate" v-if="nodeData.className" size="mini" type="warning" class="el-icon-edit">修改名称</el-button>
             <el-button @click="onClickRemove"  v-if="nodeData.className" size="mini" type="danger" class="el-icon-delete">删除</el-button>
+            <el-button @click="isRuleDialog = true"  v-if="nodeData.className" size="mini" type="primary" class="el-icon-setting">设置规则</el-button>
+
           </div>
         </el-card>
         <el-card shadow="hover" style=" margin-top: 20px;" >
@@ -124,15 +126,53 @@
         <el-button type="primary" @click="onClickAffirmUpdate">确 定</el-button>
       </span>
     </el-dialog>
+
+    <el-dialog :visible.sync="isRuleDialog" title="学校进出校规则设定">
+      <el-collapse>
+        <el-collapse-item v-for="item in ruleGroupArr" :key="item.id">
+          <template slot="title">
+            <el-radio v-model="radio" :label="item.id">{{ item.groupName }}</el-radio>
+          </template>
+          <el-table
+            :data="item.ruleList"
+            :row-style="{ height: '50px',}"
+            class="group-table"
+            >
+            <el-table-column label="开始时间" prop="startTime"></el-table-column>
+            <el-table-column label="结束时间" prop="endTime"></el-table-column>
+            <el-table-column label="规则" prop="avatar">
+              <template slot-scope="scope">
+                <div>
+                  <div v-if="!scope.row.ruleObj.MORNING" class="rule-checkout-list">
+                    <el-checkbox v-model="scope.row.ruleObj.INTO">进校</el-checkbox>
+                    <el-checkbox v-model="scope.row.ruleObj.OUT">出校</el-checkbox>
+                  </div>
+                  <div v-else>
+                    早上到校时间
+                  </div>
+                </div>
+              </template>
+            </el-table-column>
+          </el-table> 
+        </el-collapse-item>
+        
+      </el-collapse>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import columns from "./columns";
 import { getClass, getClassStudent, postManager, putManager, deleteManager, getGuardian } from "./api";
+import { getRuleGroup } from "../../regulation/api";
+
 import { formatDate } from "@/com/index";
 import CommonHead from './components/CommonHead.vue'
-
+const FlagEnum = {
+  INTO: 0,// 进
+  OUT: 1,// 出
+  MORNING: 2, // 早上到校时间
+};
 export default {
   name: "deviceManagement",
   data() {
@@ -173,13 +213,19 @@ export default {
       updateForm: { // 修改信息
         superId: '',
         name: ''
-      }
+      },
+      /* 设置规则组 */
+      isRuleDialog: false, // 进出校规则模态框
+      activeName: '', // 展开的规则组
+      radio: '',
+      ruleGroupArr: [], // 规则组数据
     };
   },
   components: {
     CommonHead,
   },
   async created() {
+    this.ruleList()
     this.classList()
     const defaultCheckClass= localStorage.getItem('defaultCheckClass')  // 设置之前选中了班级
     if(defaultCheckClass){
@@ -191,6 +237,37 @@ export default {
   mounted () {
   },
   methods: {
+     // 规则组列表
+     ruleList(){
+      getRuleGroup().then( res =>{
+        if(res.length){
+          this.ruleGroupArr = res
+          res.map(item =>{
+            if(item.ruleList.length){ // 说明存在规则
+              item.ruleList.map(it =>{
+                let obj = {
+                  INTO: false,// 进
+                  OUT: false,// 出
+                  MORNING: false, // 早上到校时间
+                }
+                if(it.enabledFlags.length){
+                  it.enabledFlags.forEach(key =>{
+                    console.log(FlagEnum[key])
+                    obj[key] = this.decryption(FlagEnum[key], it.flag)
+                    it.ruleObj = obj
+                  })
+                }else {
+                  it.ruleObj = obj
+                }
+              })
+            }
+            return item
+          })
+          console.log(this.ruleGroupArr)
+        }
+        
+      })
+    },
     // 点击确定修改
     onClickAffirmUpdate() {
       putManager(this.updateForm).then(res =>{
@@ -314,7 +391,16 @@ export default {
       this.phaseArr = []
       this.gradeArr = []
       this.classArr = []
-    }
+    },
+    decryption (flagEnum, flag){
+      let bitValue = 1 << flagEnum
+      return (flag & bitValue) == bitValue;
+    },
+    encryption(flagEnum, bool, flag) {
+      let bitValue = 1 << flagEnum;
+      flag = bool ? flag | bitValue : flag & ~bitValue;
+      return flag;
+    },
     
   },
 };
diff --git a/src/views/department/index.vue b/src/views/department/index.vue
index 0e7f139..f7a4dbf 100644
--- a/src/views/department/index.vue
+++ b/src/views/department/index.vue
@@ -240,6 +240,7 @@
       </span>
     </el-dialog>
     
+    
   </div>
 </template>
 
@@ -308,6 +309,7 @@ export default {
       roleArr: [], // 角色列表
       roleIds: [], // 角色id
       userId: null, // 设置角色的userid
+
     };
   },
   components: {
diff --git a/src/views/regulation/api.js b/src/views/regulation/api.js
new file mode 100644
index 0000000..cfc54fb
--- /dev/null
+++ b/src/views/regulation/api.js
@@ -0,0 +1,69 @@
+import request from '@/utils/request';
+
+// 获取规则组列表
+export function getRuleGroup  () {
+    return request({
+        url: '/manager/device/rule/list',
+        method: 'get',
+    })
+}
+// 获取规则组用户列表
+export function getRuleGroupUser  (deptId, params) {
+    return request({
+        url: `/manager/user/list/${deptId}`,
+        method: 'get',
+        params
+    })
+}
+// 新增规则组
+export function postRuleGroup  (data) {
+    return request({
+        url: `/manager/device/rule/group`,
+        method: 'POST',
+        data
+    })
+}
+// 修改规则组
+export function putRuleGroup  (data) {
+    return request({
+        url: `/manager/device/rule/group`,
+        method: 'PUT',
+        data
+    })
+}
+// 删除规则组
+export function deleteRuleGroup  (id) {
+    return request({
+        url: `/manager/device/rule/group/${id}`,
+        method: 'DELETE',
+    })
+}
+
+// 添加规则
+export function postRule  (data) {
+    return request({
+        url: `/manager/device/rule`,
+        method: 'post',
+        data
+    })
+}
+// 删除规则
+export function deleteRule  (id) {
+    return request({
+        url: `/manager/device/rule/${id}`,
+        method: 'DELETE',
+    })
+}
+
+// 修改规则
+export function putRule  (data) {
+    return request({
+        url: `/manager/device/rule`,
+        method: 'put',
+        data
+    })
+}
+
+
+
+
diff --git a/src/views/regulation/columns.js b/src/views/regulation/columns.js
new file mode 100644
index 0000000..44ca9f0
--- /dev/null
+++ b/src/views/regulation/columns.js
@@ -0,0 +1,52 @@
+export default   [
+  {
+    label: "设备id",
+    prop: "deviceId",
+    type: "text",
+  },
+  {
+    label: "账号名称",
+    prop: "username",
+    type: "text",
+  },
+  
+  {
+    label: "设备名称",
+    prop: "deviceName",
+    type: "text",
+  },
+  {
+    label: "用户名",
+    prop: "username",
+    type: "image",
+  },
+  {
+    label: "密码",
+    prop: "password",
+    type: "text",
+  },
+ 
+
+  {
+    label: "设备标签",
+    prop: "deviceLabel",
+    type: "text",
+  },
+  {
+    label: "设备地址",
+    prop: "deviceUrl",
+    type: "text",
+  },
+  {
+    label: "设备状态",
+    prop: "deviceStatus",
+    type: "text",
+  },
+ 
+  {
+    label: "设备物理地址",
+    prop: "macAddress",
+    type: "text",
+  },
+  
+]
\ No newline at end of file
diff --git a/src/views/regulation/components/CommonHead.vue b/src/views/regulation/components/CommonHead.vue
new file mode 100644
index 0000000..ab2b29c
--- /dev/null
+++ b/src/views/regulation/components/CommonHead.vue
@@ -0,0 +1,75 @@
+<template>
+  <div>
+    <el-button @click="newlyClick" type="primary" size="mini" icon="el-icon-plus"
+      >新增食谱</el-button
+    >
+    <!-- <el-button @click="updateClick"  icon="el-icon-edit"  size="mini" >修改食谱</el-button>
+    <el-button @click="newlyTwoClick" type="success" size="mini" icon="el-icon-plus"
+      >新增周次</el-button
+    >
+    <el-button @click="updateTwoClick"  icon="el-icon-edit" size="mini" >修改周次</el-button>
+    <el-button @click="newlyClassClick" type="warning" size="mini" icon="el-icon-plus">新增食谱总类别</el-button>
+    <el-button @click="updateClassClick"  icon="el-icon-edit" size="mini" >修改食谱类别</el-button> -->
+    <!-- <el-button @click="resetClick" type="info" size="mini" icon="iconfont icon-biaodan"
+      >重置</el-button
+    >
+    <el-button @click="searchClick" type="warning" size="mini" icon="el-icon-search"
+      >搜索</el-button
+    > -->
+    <el-input
+      v-if="false"
+      v-model="searchData"
+      size="mini"
+      style="width: 20%"
+      placeholder="请输入搜索的关键字"
+    >
+    </el-input>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "CommonHead",
+  data() {
+    return {
+      searchData: "",
+    };
+  },
+
+  methods: {
+    newlyClick() {
+      // 在此处调用父组件传入的方法叫父组件做事情
+      this.$emit("newly-data");
+    },
+    updateClick() {
+      // 在此处调用父组件传入的方法叫父组件做事情
+      this.$emit("update-data");
+    },
+    newlyTwoClick() {
+      // 在此处调用父组件传入的方法叫父组件做事情
+      this.$emit("newly-two-data");
+    },
+    updateTwoClick() {
+      // 在此处调用父组件传入的方法叫父组件做事情
+      this.$emit("update-two-data");
+    },
+    newlyClassClick() {
+      // 在此处调用父组件传入的方法叫父组件做事情
+      this.$emit("newly-class-data");
+    },
+    updateClassClick() {
+      // 在此处调用父组件传入的方法叫父组件做事情
+      this.$emit("update-class-data");
+    },
+    resetClick() {
+      this.$emit("reset-data");
+    },
+    searchClick() {
+      this.$emit("search-data", this.searchData);
+    },
+    
+  },
+};
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/regulation/components/CommonTablesImg.vue b/src/views/regulation/components/CommonTablesImg.vue
new file mode 100644
index 0000000..c5d3705
--- /dev/null
+++ b/src/views/regulation/components/CommonTablesImg.vue
@@ -0,0 +1,115 @@
+<template>
+  <el-table
+    border
+    :header-cell-style="{
+      background: '#f5f7fa',
+    }"
+    :data="tableData"
+    style="width: 100%; margin-top: 20px"
+    height="650"
+    size="mini"
+  >
+    <el-table-column
+      v-if="
+        column.label !== 'id' &&
+        column.label !== '审批人Id' &&
+        column.label !== '抄送人Id'
+      "
+      v-for="(column, index) in tableColumns"
+      :key="index"
+      :prop="column.prop"
+      :label="column.label"
+      width="auto"
+    >
+      <template slot-scope="scope">
+        <span v-if="column.type === 'text'"> {{ scope.row[column.prop] }}</span>
+        <div v-else-if="column.type === 'image'">
+          <img style="width: 200px; height: 100px" :src="scope.row[column.prop]" />
+        </div>
+      </template>
+    </el-table-column>
+
+    <el-table-column label="操作" width="160">
+      <template slot-scope="scope">
+        <el-button
+          @click="handleEdit(scope.row)"
+          class="el-icon-edit"
+          type="text"
+          size="small"
+          >编辑</el-button
+        >
+        <el-popconfirm @confirm="handleDelete(scope.row)" :title="'确定要删除吗？'">
+          <el-button
+            slot="reference"
+            style="margin-left: 10px; color: red"
+            class="el-icon-delete"
+            type="text"
+            size="small"
+            >删除</el-button
+          >
+        </el-popconfirm>
+      </template>
+    </el-table-column>
+  </el-table>
+</template>
+<script>
+export default {
+  name: "CommonTablesImg",
+  props: {
+    columns: {
+      type: Array,
+      required: true,
+    },
+    data: {
+      type: Array,
+      required: true,
+    },
+    deleteFunc: {
+      type: Function,
+      default: () => {},
+    },
+    editFunc: {
+      type: Function,
+      default: () => {},
+    },
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    // 删除事件
+    handleDelete(row) {
+      this.deleteFunc(row.id);
+    },
+    // 编辑事件
+    handleEdit(row) {
+      console.log(row);
+      this.editFunc(row);
+    },
+  },
+
+  computed: {
+    tableColumns() {
+      // 处理传进来的列配置，返回符合 Element UI 表格要求的配置
+      return this.columns.map((column) => {
+        return {
+          label: column.label,
+          prop: column.prop,
+          type: column.type,
+        };
+      });
+    },
+    tableData() {
+      // 处理传进来的数据，返回符合 Element UI 表格要求的数据
+      return this.data.map((rowData) => {
+        let row = {};
+        for (let column of this.columns) {
+          row[column.prop] = rowData[column.prop];
+        }
+        return row;
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/views/regulation/index.vue b/src/views/regulation/index.vue
new file mode 100644
index 0000000..7649240
--- /dev/null
+++ b/src/views/regulation/index.vue
@@ -0,0 +1,573 @@
+<template>
+  <div class="box">
+    
+    <div class="form-adapt-container">
+        <el-card shadow="hover">
+          <div>
+            <el-button @click="isGroupDialog = true; groupTitle= '新增'; resetGroupForm()" size="medium" class="el-icon-plus">新增规则组</el-button>
+          </div>
+        </el-card>
+        <el-card shadow="hover" style=" margin-top: 20px;" >
+          <div style="margin-bottom: 10px;">
+            <el-button @click="onClickAddUser" v-if="ruleData.name" type="primary">新增人员</el-button>
+          </div>
+          <!-- 分组表格 -->
+          <el-table @expand-change="expandChange" :data="ruleGroupArr" :row-key="getRowKeys" :expand-row-keys="expands" class="group-table" >
+
+            <el-table-column type="expand">
+              <template slot-scope="props">
+                <div style="padding: 0 0; box-sizing: border-box;">
+                  <el-table
+                    :data="props.row.ruleList"
+                    :row-style="{ height: '50px',}"
+                    class="group-table"
+                    >
+                    <el-table-column label="开始时间" prop="startTime"></el-table-column>
+                    <el-table-column label="结束时间" prop="endTime"></el-table-column>
+                    <el-table-column label="规则" prop="avatar">
+                      <template slot-scope="scope">
+                        <div>
+                          <div v-if="!scope.row.ruleObj.MORNING" class="rule-checkout-list">
+                            <el-checkbox v-model="scope.row.ruleObj.INTO">进校</el-checkbox>
+                            <el-checkbox v-model="scope.row.ruleObj.OUT">出校</el-checkbox>
+                          </div>
+                          <div v-else>
+                            早上到校时间
+                          </div>
+                        </div>
+                      </template>
+                    </el-table-column>
+                    <el-table-column label="操作" prop="avatar">
+                      
+                      <template  slot-scope="scope">
+                        <!-- 修改早上到校时间 -->
+                        <el-button v-if="scope.row.flag == 4" 
+                          @click=" onClickUpdateRuleMoring(scope.row)"
+                          slot="reference"
+                          style="margin-left: 10px;"
+                          class="el-icon-edit"
+                          type="text"
+                          size="small"
+                        >修改</el-button>
+                        <el-button
+                          v-if="scope.row.flag != 4"
+                          @click="onClickUpdateRule(scope.row)"
+                          slot="reference"
+                          style="margin-left: 10px;"
+                          class="el-icon-edit"
+                          type="text"
+                          size="small"
+                          >修改</el-button
+                        >
+                        <el-button
+                          v-if="scope.row.flag != 4"
+                          @click="onClickDeleteRule(scope.row)"
+                          slot="reference"
+                          style="margin-left: 10px; color: red"
+                          class="el-icon-delete"
+                          type="text"
+                          size="small"
+                          >删除</el-button
+                        >
+                      </template>
+                    </el-table-column>
+                  </el-table> 
+                </div>
+              </template>
+            </el-table-column>
+            
+            <el-table-column
+              prop="groupName"
+              label="规则组"
+            />
+            <el-table-column
+              prop="sort"
+              label="排序"
+            />
+            <el-table-column label="操作" prop="avatar">
+              <template slot-scope="scope">
+                <el-button
+                  slot="reference"
+                    style="margin-left: 10px;"
+                    class="el-icon-plus"
+                    type="text"
+                    size="small"
+                  @click="onClickAdd(scope.row)"
+                >新增规则</el-button>
+                <el-button
+                  slot="reference"
+                    style="margin-left: 10px;"
+                    class="el-icon-edit"
+                    type="text"
+                    size="small"
+                  @click="onClickUpdate(scope.row)"
+                >修改</el-button>
+                <el-button
+                  @click="onClickDelete(scope.row)"
+                  slot="reference"
+                  style="margin-left: 10px; color: red"
+                  class="el-icon-delete"
+                  type="text"
+                  size="small"
+                  >删除</el-button
+                >
+              </template>
+            </el-table-column>
+          </el-table>
+
+          
+        </el-card>
+    </div>
+    <!-- 新增修改规则组 -->
+    <el-dialog
+      :title=" groupTitle + '规则组'"
+      :visible.sync="isGroupDialog"
+      width="30%">
+      <el-form ref="groupForm" :model="groupForm" label-width="100px">
+        <el-form-item  label="规则组名称">
+          <el-input v-model="groupForm.groupName" placeholder="请输入规则组名称"></el-input>
+        </el-form-item>
+        <el-form-item  label="排序">
+          <el-input v-model="groupForm.sort" type="number" placeholder="数值越小越靠前" ></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isGroupDialog = false">取 消</el-button>
+        <el-button type="primary" @click="onClickAffirm">确 定</el-button>
+      </span>
+    </el-dialog>
+
+    <!-- 新增规则-->
+    <el-dialog
+      :title="ruleTitle+'规则'"
+      :visible.sync="isAddDialog"
+      width="30%">
+      <el-form ref="ruleForm" :model="ruleForm" label-width="100px">
+        <el-form-item  label="开始时间">
+          <el-time-picker v-model="ruleForm.startTime"   placeholder="请选择开始时间点" value-format="HH:mm:ss" />
+        </el-form-item>
+        <el-form-item  label="结束时间">
+          <el-time-picker v-model="ruleForm.endTime"   placeholder="请选择结束时间点" value-format="HH:mm:ss" />
+        </el-form-item>
+        <el-form-item  label="规则设定">
+          <el-checkbox-group @change="onChangeCheckout" v-model="checkArr">
+            <el-checkbox :label="0">进校</el-checkbox>
+            <el-checkbox :label="1">出校</el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isAddDialog = false">取 消</el-button>
+        <el-button type="primary" @click="onClickAffirmRule">确 定</el-button>
+      </span>
+    </el-dialog>
+    <!-- 早上到校时间修改 -->
+    <el-dialog
+      :title="'修改规则'"
+      :visible.sync="isMoringDialog"
+      width="30%">
+      
+      <el-form ref="ruleForm" :model="ruleMoringForm" label-width="100px">
+        <el-form-item  label="到校时间">
+          <el-time-picker v-model="ruleMoringForm.startTime"   placeholder="请选择到校时间" value-format="HH:mm:ss" />
+        </el-form-item>
+        
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isMoringDialog = false">取 消</el-button>
+        <el-button type="primary" @click="onClickAffirmRuleMoring">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import columns from "./columns";
+import { getRuleGroup, getRuleGroupUser, postRuleGroup, putRuleGroup, deleteRuleGroup,  postRule, putRule, deleteRule, deleteRuleGroupUser,  } from "./api";
+import { getRole, postRole, putRole, deleteRole} from "../rolePermissions/api";
+
+import { formatDate } from "@/com/index";
+import CommonHead from './components/CommonHead.vue'
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+
+const errorMessages = {
+  name: '请输入规则组名称',
+  sort: '请输入排序',
+};
+const FlagEnum = {
+  INTO: 0,// 进
+  OUT: 1,// 出
+  MORNING: 2, // 早上到校时间
+};
+const FlagArr = ['INTO', 'OUT']
+export default {
+  
+  name: "deviceManagement",
+  data() {
+    return {
+      columns,
+      total: 0,
+      query: {
+        current: 1,
+        size: 10,
+      },
+      defaultProps: {
+        children: 'rule',
+        label: 'groupName'
+      },
+      ruleGroupArr: [], // 校区规则组列表
+      ruleGroupData: '', // 选中的当前规则组
+      ruleArr: [],// 规则列表
+      ruleData: {}, 
+      isGroupDialog: false, // 新增修改规则组弹框
+      groupTitle: '新增', // 新增修改规则组标题
+      groupForm: {
+        groupName: null,
+        sort: null,
+      },// 新增规则组表单
+      checkList: [
+      ],
+      isAddDialog: false, // 点击新增或修改规则弹框
+      ruleForm: { // 新增规则表单
+        groupId: "",
+        startTime: "",
+        endTime: "",
+        flag: ''
+      },
+      checkArr: [], // 选中的规则 进校0 出校1
+      expands: [], // 展开的规则列表
+      ruleTitle: '新增', // 新增或修改 规则标题
+      isMoringDialog: false, // 早上到校时间修改
+      ruleMoringForm: {}, // 早上到校时间修改表单
+    };
+  },
+  components: {
+    CommonHead,
+    Treeselect 
+
+  },
+  async created() {
+    this.ruleList()
+    
+    // 获取角色列表
+    // getRole().then(res =>{
+    //   this.roleArr = res
+    // })
+    
+  },
+  mounted () {
+    
+  },
+  methods: {
+    // 点击修改按钮
+    onClickUpdateRule(item) {
+      this.ruleTitle = '修改'
+      this.checkArr = [] // 重置选中的多选框
+      this.ruleForm = { // 重置规则表单
+        id: item.id,
+        startTime: item.startTime,
+        endTime: item.endTime,
+        flag: '',
+      }
+      FlagArr.map(it =>{
+        if(this.decryption(FlagEnum[it], item.flag)){
+          this.checkArr.push(FlagEnum[it])
+        }
+      })
+      this.isAddDialog = true
+    },
+    
+    // 点击修噶早上到校规则
+    onClickUpdateRuleMoring(item) {
+      this.isMoringDialog = true
+
+      this.ruleMoringForm = { // 重置规则表单
+        id: item.id,
+        startTime: item.startTime,
+        endTime: item.endTime,
+        flag: item.flag,
+      }
+    },
+    // 点击确定修改早上到校规则
+    onClickAffirmRuleMoring() {
+      putRule(this.ruleMoringForm).then(res =>{
+        this.$message.success('修改成功')
+        this.isMoringDialog = false
+        this.ruleList()
+      })
+    },
+    // 点击展开
+    expandChange(item){
+      if(this.expands.includes(item.id)){
+        this.expands.splice(this.expands.indexOf(item.id),1)
+      }else {
+        this.expands.push(item.id) 
+      }
+    },
+    // 点击确定新增规则
+    onClickAffirmRule() {
+      if(!this.ruleForm.startTime){
+        this.$message.error('请选择开始时间')
+        return 
+      }
+      if(!this.ruleForm.endTime){
+        this.$message.error('请选择结束时间')
+        return 
+      }
+
+      // 判断是否选择了进出规则
+      if(!this.checkArr.length ){
+        this.ruleForm.flag = 0
+      }else {
+        let falg = 0
+        this.checkArr.forEach(item =>{
+          falg = this.encryption(item, true, falg)
+        })
+        this.ruleForm.flag = falg
+      }
+      console.log(this.ruleForm)
+      if(this.ruleTitle == '新增'){
+        postRule(this.ruleForm).then(res =>{
+          this.$message.success('新增成功')
+          this.isAddDialog = false
+          this.ruleList()
+        })
+      }else {
+        putRule(this.ruleForm).then(res =>{
+          this.$message.success('修改成功')
+          this.isAddDialog = false
+          this.ruleList()
+        })
+      }
+      
+    },
+    // 点击新增规则
+    onClickAdd(item) {
+      this.ruleForm = { // 重置规则表单
+        groupId: "",
+        startTime: "",
+        endTime: "",
+        flag: ''
+      },
+      this.ruleTitle = '新增'
+      this.checkArr = [] // 重置选中的多选框
+      this.isAddDialog = true
+      this.ruleForm.groupId = item.id
+    },
+    // 点击选择框
+    onChangeCheckout(e) {
+      console.log(e)
+    },
+    // 点击确认新增规则组
+    onClickAffirm() {
+      if(!this.groupForm.groupName){
+        this.$message.error('请输入规则组名称');
+        return
+      }
+      if(!this.groupForm.sort){
+        this.$message.error('请输入排序');
+        return
+      }
+      if(this.groupTitle == '新增'){
+        postRuleGroup(this.groupForm).then(res =>{
+          this.ruleList()
+          this.isGroupDialog = false
+          this.$message.success('新增成功')
+        })
+      }else {
+        putRuleGroup(this.groupForm).then(res =>{
+          this.ruleList()
+          this.isGroupDialog = false
+          this.$message.success('修改成功')
+        })
+      }
+     
+    },
+    // 点击修改规则组
+    onClickUpdate(item) {
+      this.ruleGroupData = item
+      this.isGroupDialog = true
+      this.groupTitle= '修改';
+      this.groupForm = {
+        groupName: this.ruleGroupData.groupName,
+        sort: this.ruleGroupData.sort,
+        id: this.ruleGroupData.id,
+      }// 修改规则组表单
+    },
+   
+    // 规则组列表
+    ruleList(){
+      getRuleGroup().then( res =>{
+        if(res.length){
+          this.ruleGroupArr = res
+          res.map(item =>{
+            if(item.ruleList.length){ // 说明存在规则
+              item.ruleList.map(it =>{
+                let obj = {
+                  INTO: false,// 进
+                  OUT: false,// 出
+                  MORNING: false, // 早上到校时间
+                }
+                if(it.enabledFlags.length){
+                  it.enabledFlags.forEach(key =>{
+                    console.log(FlagEnum[key])
+                    obj[key] = this.decryption(FlagEnum[key], it.flag)
+                    it.ruleObj = obj
+                  })
+                }else {
+                  it.ruleObj = obj
+                }
+              })
+            }
+            return item
+          })
+          console.log(this.ruleGroupArr)
+        }
+        
+      })
+    },
+    // 点击删除规则
+    onClickDeleteRule(item) {
+      this.$confirm(`确定要删除吗?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteRule(item.id).then(res => {
+          this.ruleList();
+          this.$message({ type: 'success',  message: '删除成功!'  });
+        })
+      }).catch(() => {
+        this.$message({ type: 'info',  message: '已取消删除' });          
+      });
+    },
+    // 点击删除组
+    onClickRemove (item) {
+      this.$confirm(`确定要删除${item.groupName}吗?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteRuleGroup(item.id).then(res => {
+          this.ruleList();
+          this.$message({ type: 'success',  message: '删除成功!'  });
+        })
+      }).catch(() => {
+        this.$message({ type: 'info',  message: '已取消删除' });          
+      });
+    },
+
+    // 点击切换页数
+    onClickCurrent(val) {
+      this.userQuery.current = val;
+      this.allUserList();
+    },
+    // 点击了每页页数
+    onClickSize(val) {
+      this.userQuery.size = val;
+      this.allUserList();
+    },
+    resetGroupForm() {
+     this.groupForm = {
+        groupName: null,
+        sort: null,
+      }// 新增规则组表单
+    },
+    resetRuleGroupUpdateForm() {
+      this.ruleUpdateForm = {
+        name: '',
+        sort: '',
+        ruleId: null,
+      }
+    },
+    decryption (flagEnum, flag){
+      let bitValue = 1 << flagEnum
+      return (flag & bitValue) == bitValue;
+    },
+    encryption(flagEnum, bool, flag) {
+      let bitValue = 1 << flagEnum;
+      flag = bool ? flag | bitValue : flag & ~bitValue;
+      return flag;
+    },
+    getRowKeys(row) {
+      return row.id
+    },
+    
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.box{
+  display: flex;
+  .side-nav{
+    width: 250px;
+    height: 100%;
+    background-color: #fff;
+    padding: 20px 20px  20px 20px;
+    box-sizing: border-box;
+    margin-right: 20px;
+    h3{
+      margin-bottom: 20px;
+    }
+    .add-box{
+      padding: 5px;
+      box-sizing: border-box;
+      .add-list{
+        margin: 0 0 10px;
+      }
+    }
+  }
+  .form-adapt-container{
+    flex: 1;
+  }
+}
+.material-list{
+  width: 100%; 
+  .top-box{
+    display: flex; 
+  }
+  .label{
+    display: flex; flex: 1; align-items: center;
+    height: 36px;
+  }
+  .delete-box{
+    width: 30px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+  }
+}
+.content::-webkit-scrollbar {
+    width: 0; /* 设置滚动条的宽度 */
+}
+.group-list{
+  line-height: 30px; cursor: pointer; padding: 0 0  0 10px; box-sizing: border-box;
+}
+.active{
+  background-color: rgb(245,247,250)
+}
+.rule-checkout-list{
+  position: relative;
+}
+.rule-checkout-list::after{
+  content: '';
+  position: absolute;
+  z-index: 100;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background-color: transparent;
+  left: 0;
+  bottom: 0;
+}
+
+.group-table .el-table__row {
+  border: none !important
+}
+
+</style>
\ No newline at end of file