行为感知结构修改

src/components/scene/access/sceneAccessAction.vue

@@ -1,95 +1,74 @@
 <template>
-  <div class="accessManage">
-    <div class="page-query-core">
-      <Query
-        :show="[]"
-        :query-data.sync="queryData"
-        :search="search"
-        style="
-          background: #fff;
-          height: 60px;
-          padding: 10px;
-          border-radius: 5px;
-          margin-bottom: 10px;
-        "
-      >
-        <template #extraItem>
-          <a-form-model-item label="人员姓名" style="margin-left: 45px">
-            <a-input
-              style="width: 250px"
-              v-model="queryData.name"
-              placeholder="请输入姓名"
-            />
-          </a-form-model-item>
-          <a-form-model-item label="手机号" style="margin-left: 45px">
-            <a-input
-              style="width: 250px"
-              v-model="queryData.phone"
-              placeholder="请输入手机号"
-            />
-          </a-form-model-item>
-          <a-form-model-item label="所属公司" style="">
-            <a-select v-model="queryData.company" style="width: 250px">
-              <a-select-option
-                v-for="(item, index) in companyOptions"
-                :key="index"
-                :value="item.value"
-              >
-                {{ item.label }}
-              </a-select-option>
-            </a-select>
-          </a-form-model-item>
-        </template>
-      </Query>
-    </div>
+  <div class="accessManage ">
 
     <div class="accessManage-body">
-      <a-row style="height: 100%">
+      <a-row :gutter="[20,12]" style="height: 700px">
         <a-col :span="4" style="height: 100%">
-          <SceneSecurityPersonSelect
-            :left-title="'名单'"
-            :tree-data="treeData"
-            :new-person-list="newPersonList"
-          ></SceneSecurityPersonSelect>
+          <SceneSecurityPersonSelect :callback="treeSelect" :left-title="'名单'" :tree-data="treeData" :new-person-list="newPersonList"></SceneSecurityPersonSelect>
         </a-col>
         <a-col :span="20">
-          <a-table
-            :columns="tableColumns"
-            :data-source="tableData"
-            :pagination="true"
-            :scroll="{ y: tableContainerHeight }"
-            bordered
-          >
+          <div class="page-query-core" style="margin: 15px 0px;padding: 12px;background-color: #fafafa">
+            <Query :show="[]" :query-data.sync="queryData" :search="search">
+              <template #extraItem>
+                <a-form-model-item label="人员姓名" style="margin-left: 30px">
+                  <a-input style="width: 200px" v-model="queryData.name" placeholder="请输入姓名"/>
+                </a-form-model-item>
+                <a-form-model-item label="手机号" style="margin-left: 30px">
+                  <a-input style="width: 200px" v-model="queryData.phone" placeholder="请输入手机号"/>
+                </a-form-model-item>
+                <a-form-model-item label="所属公司" style="">
+                  <a-select v-model="queryData.company" style="width: 200px">
+                    <a-select-option v-for="(item,index) in companyOptions" :key="index" :value="item.value">
+                      {{ item.label }}
+                    </a-select-option>
+                  </a-select>
+                </a-form-model-item>
+              </template>
+            </Query>
+          </div>
+          <div style="padding: 0 4px 8px" v-show="false">
+            <span style="font-size: 16px;line-height: 30px;display: inline-block;color: #6b6b6b">{{ tableTitle }}-人员列表</span>
+            <a-button type="primary" size="small" style="font-size: 13px;float: right;width:120px;">添加人员</a-button>
+          </div>
+          <a-table :columns="tableColumns" :data-source="tableData" :pagination="true"
+                   :scroll="{ y: tableContainerHeight }" bordered>
             <template #action="text, record">
-              <a-button type="link" @click="showPeopleBehaviour(record)">
-                行为感知
-              </a-button>
-              <a-button type="link" @click="view(record)"> 查看 </a-button>
-              <a-button type="link" @click="del(record)"> 删除 </a-button>
+              <a-button type="link" @click="showPeopleBehaviour(record)"> 行为感知 </a-button>
+              <a-popconfirm
+                  title="确定要删除吗?"
+                  ok-text="是"
+                  cancel-text="否"
+                  @click="del(record)"
+              >
+                <a-button type="link" > 删除 </a-button>
+              </a-popconfirm>
+
             </template>
+
           </a-table>
         </a-col>
       </a-row>
+
     </div>
 
     <a-modal
-      title="行为感知"
-      v-if="showBehaviour"
-      :visible="showBehaviour"
-      width="65%"
-      @cancel="hideBehaviour"
-      :footer="null"
+        title="行为感知"
+        v-if="showBehaviour"
+        :visible="showBehaviour"
+        width="65%"
+        @cancel="hideBehaviour"
+        :footer="null"
     >
       <SceneAccessBehaviour :item="currItem" />
     </a-modal>
 
     <a-modal
-      title="新建名单"
-      v-if="newPersonListVisible"
-      :visible="newPersonListVisible"
-      width="400px"
-      @cancel="hideNewPersonList"
-      @ok="addNewPersonList"
+        title="新建名单"
+        v-if="newPersonListVisible"
+        :visible="newPersonListVisible"
+        width="400px"
+        @cancel="hideNewPersonList"
+        @ok="addNewPersonList"
     >
       <a-input v-model="personListName" placeholder="请输入名单名称" />
     </a-modal>
@@ -107,101 +86,101 @@ export default {
   },
   data() {
     return {
+      tableTitle: '',
       treeData: [
         {
-          title: "重点名单",
-          key: "重点名单",
-        },
+          title: '重点名单',
+          key: '重点名单'
+        }
       ],
-      personListName: "",
+      personListName: '',
       showBehaviour: false,
       newPersonListVisible: false,
       currentPage: 1,
       queryData: {
-        objective: "1",
-        company: "0",
+        objective: '1',
+        company: '0'
       },
-      objectiveMap: new Map(),
+      objectiveMap:new Map(),
       objectiveOptions: [
         {
-          label: "全部",
-          value: "0",
+          label: '全部',
+          value: '0'
         },
         {
-          label: "开会",
-          value: "1",
+          label: '开会',
+          value: '1'
         },
         {
-          label: "交流",
-          value: "2",
+          label: '交流',
+          value: '2'
         },
       ],
-      companyMap: new Map(),
+      companyMap:new Map(),
       companyOptions: [
         {
-          label: "全部",
-          value: "0",
-        },
-        {
-          label: "北京电信规划院",
-          value: "1",
+          label: '全部',
+          value: '0'
+        },{
+          label: '北京电信规划院',
+          value: '1'
         },
       ],
       tableContainerHeight: 500,
       tableColumns: [
         {
-          title: "序号",
-          dataIndex: "index",
-          key: "index",
+          title: '序号',
+          dataIndex: 'index',
+          key: 'index',
           align: "center",
           width: 80,
-          customRender: (text, record, index) => `${index + 1}`,
+          customRender: (text, record, index) => `${index + 1}`
         },
         {
-          title: "姓名",
-          dataIndex: "visitor",
+          title: '姓名',
+          dataIndex: 'visitor',
           width: 150,
-          key: "visitor",
+          key: 'visitor',
         },
         {
-          title: "手机号",
-          dataIndex: "visitor_phone",
-          key: "visitor_phone",
+          title: '手机号',
+          dataIndex: 'visitor_phone',
+          key: 'visitor_phone',
           width: 250,
         },
         {
-          title: "所属公司",
-          dataIndex: "department",
-          key: "department",
+          title: '所属公司',
+          dataIndex: 'department',
+          key: 'department',
         },
         {
-          title: "人脸信息",
-          dataIndex: "faceInfo",
-          key: "faceInfo",
+          title: '人脸信息',
+          dataIndex: 'faceInfo',
+          key: 'faceInfo',
         },
         {
-          title: "操作",
-          key: "operation",
-          scopedSlots: { customRender: "action" },
+          title: '操作',
+          key: 'operation',
+          scopedSlots: {customRender: 'action'},
         },
+
       ],
-      tableData: [],
+      tableData:[],
       currItem: {},
       originalData: [
         {
-          key: "1",
+          key: '1',
           visitor: "潘夏彤",
           visitor_phone: "13038678756",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B3",
-          interviewee: "胡八一",
-          interviewee_phone: "15643567892",
+          interviewee: "胡八一", interviewee_phone: "15643567892",
           directionStatus: "进",
         },
         {
-          key: "2",
+          key: '2',
           visitor: "庞慧",
           visitor_phone: "13038678756",
           department: "北京电信规划院",
@@ -213,241 +192,208 @@ export default {
           directionStatus: "进",
         },
         {
-          key: "3",
+          key: '3',
           visitor: "李天泽",
           visitor_phone: "13038678756",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "张永军",
-          interviewee_phone: "15643563892",
+          interviewee: "张永军", interviewee_phone: "15643563892",
           directionStatus: "进",
         },
         {
-          key: "4",
+          key: '4',
           visitor: "张雪",
           visitor_phone: "1589453012",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "胡八一",
-          interviewee_phone: "15643567892",
-          directionStatus: "进",
+          interviewee: "胡八一", interviewee_phone: "15643567892",directionStatus: "进",
         },
         {
-          key: "5",
+          key: '5',
           visitor: "王峰",
           visitor_phone: "15638295684",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "胡八一",
-          interviewee_phone: "15643563892",
-          directionStatus: "进",
+          interviewee: "胡八一", interviewee_phone: "15643563892",directionStatus: "进",
         },
         {
-          key: "6",
+          key: '6',
           visitor: "张玉",
           visitor_phone: "17856982569",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "胡八一",
-          interviewee_phone: "15643563892",
-          directionStatus: "进",
+          interviewee: "胡八一", interviewee_phone: "15643563892",directionStatus: "进",
         },
         {
-          key: "7",
+          key: '7',
           visitor: "李天泽",
           visitor_phone: "13032678754",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "交流",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "8",
+          key: '8',
           visitor: "李天泽",
           visitor_phone: "13032678754",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "交流",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "9",
+          key: '9',
           visitor: "李天泽",
           visitor_phone: "13032678754",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "交流",
           direction: "进入B2",
-          interviewee: "胡八一",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "胡八一", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "10",
+          key: '10',
           visitor: "李天泽",
           visitor_phone: "12232678754",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "交流",
           direction: "进入B2",
-          interviewee: "胡八一",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "胡八一", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "11",
+          key: '11',
           visitor: "李天泽",
           visitor_phone: "12232678754",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "交流",
           direction: "出去B2",
-          interviewee: "胡八一",
-          interviewee_phone: "15943563892",
-          directionStatus: "出",
+          interviewee: "胡八一", interviewee_phone: "15943563892",directionStatus: "出",
         },
         {
-          key: "12",
+          key: '12',
           visitor: "李天泽",
           visitor_phone: "12232678759",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "交流",
           direction: "出去B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943463892",
-          directionStatus: "出",
+          interviewee: "刘一鸣", interviewee_phone: "15943463892",directionStatus: "出",
         },
         {
-          key: "13",
+          key: '13',
           visitor: "李天泽",
           visitor_phone: "15513548219",
           department: "北京电信规划院",
           time: "2023-03-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "14",
+          key: '14',
           visitor: "李天泽",
           visitor_phone: "15513548214",
           department: "北京电信规划院",
           time: "2023-03-20 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "15",
+          key: '15',
           visitor: "李天泽",
           visitor_phone: "15511548219",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "16",
+          key: '16',
           visitor: "李天泽",
           visitor_phone: "15513548219",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "进",
         },
         {
-          key: "17",
+          key: '17',
           visitor: "李天泽",
           visitor_phone: "15513548219",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "刘一鸣",
-          interviewee_phone: "13943563892",
-          directionStatus: "进",
+          interviewee: "刘一鸣", interviewee_phone: "13943563892",directionStatus: "进",
         },
         {
-          key: "18",
+          key: '18',
           visitor: "李天泽",
           visitor_phone: "15513548219",
           department: "北京电信规划院",
           time: "2023-03-10 12:00:00",
           reason: "开会",
           direction: "出去B1",
-          interviewee: "刘一鸣",
-          interviewee_phone: "15943563892",
-          directionStatus: "出",
+          interviewee: "刘一鸣", interviewee_phone: "15943563892",directionStatus: "出",
         },
         {
-          key: "19",
+          key: '19',
           visitor: "李天泽",
           visitor_phone: "15513548219",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "出去B2",
-          interviewee: "钱多多",
-          interviewee_phone: "15942563898",
-          directionStatus: "出",
+          interviewee: "钱多多", interviewee_phone: "15942563898",directionStatus: "出",
         },
         {
-          key: "20",
+          key: '20',
           visitor: "李天泽",
           visitor_phone: "15913548219",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "钱多多",
-          interviewee_phone: "15942563898",
-          directionStatus: "进",
+          interviewee: "钱多多", interviewee_phone: "15942563898",directionStatus: "进",
         },
         {
-          key: "21",
+          key: '21',
           visitor: "李天泽",
           visitor_phone: "15913548219",
           department: "北京电信规划院",
           time: "2022-08-26 12:00:00",
           reason: "开会",
           direction: "进入B2",
-          interviewee: "钱多多",
-          interviewee_phone: "15942563898",
-          directionStatus: "进",
+          interviewee: "钱多多", interviewee_phone: "15942563898",directionStatus: "进",
         },
-      ],
-    };
+      ]
+    }
   },
   mounted() {
-    this.initData();
+    this.initData()
   },
   methods: {
-    initData() {
+    treeSelect(val) {
+      this.tableTitle = val;
+      console.log(this.tableTitle)
+    },
+    initData(){
       this.objectiveOptions.forEach((v) => {
         this.objectiveMap.set(v.value, v.label);
       });
@@ -458,20 +404,26 @@ export default {
     },
     showPeopleBehaviour(record) {
       this.showBehaviour = true;
-      this.currItem = record;
+      this.currItem = record
+    },
+    del(item) {
+      let index = this.tableData.indexOf(item);
+      if (index>-1) {
+        this.tableData.splice(index, 1)
+      }
     },
     hideBehaviour() {
       this.showBehaviour = false;
-      this.currItem = {};
+      this.currItem = {}
     },
     showTotal(total, range) {
-      let pageSize = range[1] - range[0] + 1;
-      let pages = Math.ceil(total / pageSize);
-      return (
-        "共" + total + "条数据，第 " + this.currentPage + "/" + pages + " 页"
-      );
+      let pageSize = range[1]-range[0]+1;
+      let pages = Math.ceil(total/pageSize);
+      return '共'+total+'条数据，第 '+this.currentPage+'/'+pages+' 页';
+    },
+    onShowSizeChange(val) {
+
     },
-    onShowSizeChange(val) {},
     newPersonList() {
       this.newPersonListVisible = true;
     },
@@ -483,44 +435,48 @@ export default {
         title: this.personListName,
         key: this.personListName,
       });
-      this.personListName = "";
+      this.personListName = '';
       this.newPersonListVisible = false;
     },
-    search() {
+    search(){
       // this.$util.asyncPromise(this.getGuestData());
-      this.getGuestData();
+      this.getGuestData()
     },
-    getGuestData() {
-      let nameRegex = new RegExp(this.queryData.name);
-      let phoneRegex = new RegExp(this.queryData.phone);
+    getGuestData(){
+      let nameRegex = new RegExp(this.queryData.name)
+      let phoneRegex = new RegExp(this.queryData.phone)
       this.tableData = this.originalData.filter((item) => {
         if (
-          this.queryData.name &&
-          this.queryData.name != "" &&
-          !nameRegex.test(item.visitor)
+            this.queryData.name &&
+            this.queryData.name != "" &&
+            !nameRegex.test(item.visitor)
         ) {
           return false;
         }
         if (
-          this.queryData.phone &&
-          this.queryData.phone != "" &&
-          !phoneRegex.test(item.interviewee)
+            this.queryData.phone &&
+            this.queryData.phone != "" &&
+            !phoneRegex.test(item.interviewee)
         ) {
           return false;
         }
         if (
-          this.queryData.company &&
-          this.queryData.company != "0" &&
-          !(this.companyMap.get(this.queryData.company) === item.department)
+            this.queryData.company &&
+            this.queryData.company != "0" &&
+            !(
+                this.companyMap.get(this.queryData.company) ===
+                item.department
+            )
         ) {
           return false;
         }
 
         return true;
       });
-    },
-  },
-};
+
+    }
+  }
+}
 </script>
 
 <style lang="less" scoped>
@@ -530,14 +486,16 @@ export default {
 
   .ant-form-inline .ant-form-item {
     margin-right: 60px;
+
   }
 
   .accessManage-body {
     background: white;
     border-radius: 4px;
-    margin-top: 12px;
-    padding: 15px;
-    height: 650px;
+    padding: 20px 15px 15px;
+    height: auto;
+    overflow-y: hidden;
   }
+
 }
-</style>
+</style>

src/components/scene/access/xingweiganzhi/SceneSecurityPersonSelect.vue

@@ -6,7 +6,7 @@
       <a-tree style="height: 100%;overflow-y: auto"
               :expanded-keys="expandedKeys"
               :auto-expand-parent="true"
-              :selected-keys="['1-0']"
+              :selected-keys="selectedKeys"
               :tree-data="treeData"
               :show-icon="true"
               @expand="onExpand"
@@ -47,6 +47,7 @@ export default {
     return {
       title: '设备点位',
       expandedKeys: ['1'],
+      selectedKeys: [],
       oriData: [],
       searchValue: '',
       showNewPersonList: false,
@@ -56,7 +57,11 @@ export default {
     Card
   },
   created() {
-    this.generateList(this.treeData)
+    this.generateList(this.treeData);
+    if (this.treeData.length>0) {
+      this.selectedKeys = [this.treeData[0].key];
+      this.callback(this.treeData[0].key)
+    }
   },
   mounted() {
     if (this.leftTitle && this.leftTitle!='') {
@@ -72,6 +77,7 @@ export default {
       this.autoExpandParent = false;
     },
     onSelect(val) {
+      this.selectedKeys = val;
       if (val.length>0) {
         this.callback(val[0])
       }