Merge branch 'feature/1.3.7-interactionchain-20221102' into develop

# Conflicts:
#	languages/en.js
#	languages/es.js
#	languages/zh-CN.js
#	src/router/index.js

languages/en.js

@@ -250,7 +250,8 @@ module.exports = {
     disabled: 'Disabled!',
     disableCancel: 'Disabled',
     deleteMember: 'Are you sure you want to delete this user information?',
-    cannotDeleteAdmin: 'Cannot delete the person in charge of the organization'
+    cannotDeleteAdmin: 'Cannot delete the person in charge of the organization',
+    leaderName:'Leader Name'
   },
   home: {
     todayTask: "Today's task",
@@ -932,7 +933,11 @@ module.exports = {
     roleEvent: 'Role event',
     roleDelete: 'Delete role',
     roleEdit: 'Edit role event',
-    onChoiceRole: 'No role has been selected!'
+    onChoiceRole: 'No role has been selected!',
+    leaderRole:'Superior role',
+    leaderRolePlaceholder:'Choose the superior role',
+    roleEnum:'Type of the role',
+    roleEnumPlaceholder:'Choose the Type'
   },
   his: {
     hisPart: 'Department Query',
@@ -979,6 +984,8 @@ module.exports = {
     hisManage: 'His query',
     interactionChars: 'Interaction statistics',
     partSetting: 'Organization settings',
+    functionRoleMapping:'Function Role Setting',
+    interactionChain:'Interaction Accept Order',
     allClerk: 'All employees',
     allCustomer: 'All users',
     allDevice: 'All devices',
@@ -993,7 +1000,8 @@ module.exports = {
     ledDevice: 'LED devices',
     entraceguardUser:'Passage setting',
     customBoardManage: 'Custom Board Screen',
-    customBoardDesigner:'Designer Board Screen'
+    customBoardDesigner:'Designer Board Screen',
+    staffManageFrames:'Staff Serve Structure'
   },
   deviceType: {
     NURSE_HOST: 'Nurse Host',
@@ -1102,6 +1110,44 @@ module.exports = {
     ChooseDate: 'Choose Date',
     SleepData: 'Sleep Data'
   },
+
+  interactionChain:{
+    ActionType:'Interaction Type',
+    FirstRole:'The First Acceptor',
+    SpreadRoleNamePath:'Acception Role Sequence',
+    AddInteractionSpreadPath:'Create a new recorder',
+    AllRoles:'All Roles',
+    AcceptRoles:'Acception',
+    NoticeSequence:'Notice Sequence',
+    SearchPlaceHolder:'Enter a role name',
+    Customer:'Customer',
+    NURSE_HOST: 'Nurse Host',
+    AcceptSequence:'Accept Sequence',
+    chooseActionTypeTip:'Choose the type of interaction pls',
+    chooseRoleSquence:'Choose the role to accept pls',
+    sketchMap:'The Sketch Map Of Acception'
+  },
+  functionRoleMapping:{
+    configurateLeft:'configurate the roles own[',
+    configurateRight:']'
+  },
+  functions:{
+    MANAGE_BED:'Manage Bed'
+  },
+  clerkFrameManage: {
+    employeeView: 'Staff View',
+    frameView: 'Structure View',
+    multiClerkView: 'Structure With Multiple Staff',
+    managedFrames: 'Served Structures',
+    notManagedFrames: 'Unserved Structures',
+    settableEmployee: 'Settable Staff',
+    settedEmployee: 'Setted Staff',
+    allEmployee: 'All Staff',
+    phoneAcceptorLabel: 'The Phone Call Acceptor',
+    phoneAcceptorTipsLeft: 'If Other Employee Of Same Role With ',
+    phoneAcceptorTipsMid: ' Manage Space Frame Overlaping',
+    phoneAcceptorTipsRight: ' Charge The Phone Call'
+  },
   errorType: {
     REFRESH_TOKEN_FAILED: 'The current refresh token has expired',
     TOKEN_FAILED: 'The current token has expired',

languages/es.js

@@ -250,6 +250,8 @@ module.exports = {
     disabled: '¡Deshabilitado!',
     disableCancel: 'Deshabilitado',
     deleteMember: '¿Está seguro de que desea eliminar esta información de usuario?',
+    cantDeleteAdmin: 'No se puede eliminar al responsable de la organización',
+    leaderName:'Nombre del líder',
     cannotDeleteAdmin: 'No se puede eliminar al responsable de la organización'
   },
   home: {
@@ -932,7 +934,11 @@ module.exports = {
     roleEvent: 'Evento de rol',
     roleDelete: 'Borrar rol',
     roleEdit: 'Editar evento de rol',
-    onChoiceRole: '¡No se ha seleccionado ningún rol!'
+    onChoiceRole: '¡No se ha seleccionado ningún rol!',
+    leaderRole:'Función superior',
+    leaderRolePlaceholder:'Selección de funciones superiores',
+    roleEnum:'Tipos de funciones',
+    roleEnumPlaceholder:'Seleccionar tipo'
   },
   his: {
     hisPart: 'Consulta de sección',
@@ -979,6 +985,8 @@ module.exports = {
     hisManage: 'Su consulta',
     interactionChars: 'Interacción Estadísticas',
     partSetting: 'Organización construir',
+    functionRoleMapping:'Configuración funciones',
+    interactionChain:'Aceptar órdenes de forma interactiva',
     allClerk: 'Todos los empleados',
     allCustomer: 'Todos los usuarios',
     allDevice: 'Todos los dispositivos',
@@ -993,7 +1001,8 @@ module.exports = {
     ledDevice: 'Dispositivos LED',
     entraceguardUser:'Configuración de paso',
     customBoardManage: 'Pantalla de tablero personalizada',
-    customBoardDesigner:'Pantalla del tablero de diseño'
+    customBoardDesigner:'Pantalla del tablero de diseño',
+    staffManageFrames:'Estructura del servicio al personal'
   },
   deviceType: {
     NURSE_HOST: 'Enfermera anfitriona',
@@ -1101,6 +1110,43 @@ module.exports = {
     ChooseDate: 'fecha',
     SleepData: 'Datos de sueño'
   },
+  interactionChain:{
+    ActionType:'Tipo de interacción',
+    FirstRole:'Primera parte receptora',
+    SpreadRoleNamePath:'Aceptar secuencia de funciones',
+    AddInteractionSpreadPath:'Crear un nuevo registrador',
+    AllRoles:'Todos los papeles',
+    AcceptRoles:'Aceptación',
+    NoticeSequence:'Orden de notificación',
+    SearchPlaceHolder:'Introduzca el nombre del papel',
+    Customer:'Cliente',
+    NURSE_HOST: 'Enfermera presentadora',
+    AcceptSequence:'Secuencia de aceptación',
+    chooseActionTypeTip:'Seleccione el tipo de interacción',
+    chooseRoleSquence:'Seleccione la función de recepción',
+    sketchMap:'Diagrama de aceptación'
+  },
+  functionRoleMapping:{
+    configurateLeft:'Configurar su propio papel[',
+    configurateRight:']'
+  },
+  functions:{
+    MANAGE_BED:'Gestión de camas'
+  },
+  clerkFrameManage: {
+    employeeView: 'Vista de empleados',
+    frameView: 'Vista de estructura',
+    multiClerkView: 'Estructura multijugador',
+    managedFrames: 'Estructuras de servicios',
+    notManagedFrames: 'Estructura de los servicios no prestados',
+    settableEmployee: 'Personal configurable',
+    settedEmployee: 'Personal fijo',
+    allEmployee: 'Todo el personal',
+    phoneAcceptorLabel: 'Receptor de llamadas telefónicas',
+    phoneAcceptorTipsLeft: 'Si otros empleados del mismo papel ',
+    phoneAcceptorTipsMid: ' Superposición de marcos espaciales de gestión',
+    phoneAcceptorTipsRight: ' Cargar el teléfono'
+  },
   errorType: {
     REFRESH_TOKEN_FAILED: 'El token de actualización actual ha expirado',
     TOKEN_FAILED: 'El Token actual ha caducado',

languages/zh-CN.js

@@ -250,7 +250,8 @@ module.exports = {
     disabled: '已禁用!',
     disableCancel: '已取消禁用',
     deleteMember: '你确定要删除此用户信息?',
-    cannotDeleteAdmin: '不能删除机构负责人'
+    cannotDeleteAdmin: '不能删除机构负责人',
+    leaderName:'上级职员'
   },
   home: {
     todayTask: '今日任务',
@@ -932,7 +933,11 @@ module.exports = {
     roleEvent: '角色事件',
     roleDelete: '删除角色',
     roleEdit: '编辑角色事件',
-    onChoiceRole: '没有选中任何角色!'
+    onChoiceRole: '没有选中任何角色!',
+    leaderRole:'上级角色',
+    leaderRolePlaceholder:'请选择上级角色',
+    roleEnum:'角色类型',
+    roleEnumPlaceholder:'请选择角色类型'
   },
   his: {
     hisPart: '科室查询',
@@ -980,6 +985,8 @@ module.exports = {
     hisManage: 'his查询',
     interactionChars: '交互统计',
     partSetting: '机构设置',
+    functionRoleMapping:'功能角色设置',
+    interactionChain:'交互接收顺序',
     allClerk: '所有员工',
     allCustomer: '所有用户',
     allDevice: '所有设备',
@@ -994,7 +1001,8 @@ module.exports = {
     ledDevice: 'LED点阵屏',
     entraceguardUser:'用户通行设置',
     customBoardManage: '自定义信息看板屏',
-    customBoardDesigner:'看板屏设计'
+    customBoardDesigner:'看板屏设计',
+    staffManageFrames:'空间管理设置'
   },
   deviceType: {
     NURSE_HOST: '护士主机',
@@ -1103,6 +1111,44 @@ module.exports = {
     ChooseDate: '日期',
     SleepData: '睡眠数据'
   },
+
+  interactionChain:{
+    ActionType:'交互类型',
+    FirstRole:'最先接收角色',
+    SpreadRoleNamePath:'交互接收角色顺序',
+    AddInteractionSpreadPath:'新增交互接收顺序',
+    AllRoles:'所有角色',
+    AcceptRoles:'接收角色',
+    NoticeSequence:'注意顺序',
+    SearchPlaceHolder:'请输入角色名称',
+    Customer:'客户',
+    NURSE_HOST: '护士主机',
+    AcceptSequence:'接收顺序',
+    chooseActionTypeTip:'请选择交互类型',
+    chooseRoleSquence:'请选择接收角色的顺序',
+    sketchMap:'交互接收流程示意图'
+  },
+  functionRoleMapping:{
+    configurateLeft:'配置拥有[',
+    configurateRight:']功能的角色'
+  },
+  functions:{
+    MANAGE_BED:'管理床位'
+  },
+  clerkFrameManage:{
+    employeeView:'职员视图',
+    frameView:'空间视图',
+    multiClerkView:'多人共管空间',
+    managedFrames:'已管理空间',
+    notManagedFrames:'未管理空间',
+    settableEmployee:'可设置职员',
+    settedEmployee:'已设置职员',
+    allEmployee:'所有职员',
+    phoneAcceptorLabel:'普通电话接收人',
+    phoneAcceptorTipsLeft:'如有其他同角色职员与',
+    phoneAcceptorTipsMid:'管理空间重叠',
+    phoneAcceptorTipsRight:'负责处理普通电话呼叫'
+},
   errorType: {
     REFRESH_TOKEN_FAILED: '当前刷新Token已经失效',
     TOKEN_FAILED: '当前token已经失效',

src/api/ncs_clerk.js

@@ -54,7 +54,8 @@ export function update(id, params) {
   return request({
     url: `/ncs/clerk/${id}`,
     method: 'put',
-    data: params
+    data: params,
+    headers: { 'Content-Type': 'application/json' }
   })
 }
 export function getRoles(params) {
@@ -85,3 +86,27 @@ export function updateParentById(params) {
     data: params
   })
 }
+export function getRoleGroupClerk(partId) {
+  return request({
+    url: `/ncs/clerk/getrolegroupclerk/${partId}`,
+    method: 'GET'
+  })
+}
+
+export function getClerkManageFrame(clerkId,frameRootType) {
+  return request({
+    url: `/ncs/clerk/getclerkmanageframe/${clerkId}/${frameRootType}`,
+    method: 'GET'
+  })
+}
+
+
+export function saveClerkManageFrame(params) {
+  return request({
+    url: '/ncs/clerk/saveclerkmanageframe',
+    method: 'POST',
+    loading: true,
+    data: params,
+    headers: { 'Content-Type': 'application/json' }
+  })
+}

src/api/ncs_frameGroup.js

@@ -81,3 +81,36 @@ export function getAllFrameTreeByType(frame_type) {
   })
 }
 
+
+/** 查询空间结构的管理人员信息 */
+export function getFrameManagedClerk(frameId) {
+  return request({
+    url: `/ncs/frame/getframemanagedclerk/${frameId}`,
+    method: 'get',
+    loading: false
+  })
+}
+
+
+/** 保存空间结构的管理人员信息 */
+export function saveFrameManagedClerk(params) {
+  return request({
+    url: `/ncs/frame/saveframemanagedclerk`,
+    method: 'POST',
+    loading: true,
+    headers: { 'Content-Type': 'application/json' },
+    data:params
+  })
+}
+
+/** 查询某科室下多人共管的房间结构 */
+export function getframemultimanagedstruct(part_id, frame_type) {
+  return request({
+    url: `/ncs/frame/getframemultimanagedstruct/${part_id}/${frame_type}`,
+    method: 'get',
+    loading: false
+  })
+}
+
+
+

src/api/ncs_functions.js

@@ -0,0 +1,7 @@
+import request from '@/utils/request'
+export function getAll() {
+    return request({
+        url: '/ncs/functions/getall',
+        method: 'get'
+    })
+}

src/api/ncs_functions_role_mapping.js

@@ -0,0 +1,41 @@
+import request from '@/utils/request'
+export function getList(params) {
+    return request({
+        url: '/ncs/functionrolemapping/page',
+        method: 'POST',
+        data: params,
+        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
+    })
+}
+export function getFunctionsRoleMappingByCodeAndPartId(function_code,part_id) {
+    return request({
+        url: `/ncs/functionrolemapping/${function_code}/${part_id}`,
+        method: 'GET'
+    })
+}
+export function remove(id) {
+    return request({
+        url: `/ncs/functionrolemapping/${id}`,
+        method: 'DELETE',
+        loading: true
+    })
+}
+/** 修改 */
+export function update(id, params) {
+    return request({
+        url: `/ncs/functionrolemapping/${id}`,
+        method: 'put',
+        data: params,
+        headers: { 'Content-Type': 'application/json' }
+    })
+}
+/** 新增 */
+export function add(params) {
+    return request({
+        url: '/ncs/functionrolemapping',
+        method: 'POST',
+        loading: true,
+        data: params,
+        headers: { 'Content-Type': 'application/json' }
+    })
+}

src/api/ncs_interaction-chain.js

@@ -0,0 +1,35 @@
+import request from '@/utils/request'
+export function getList(params) {
+    return request({
+        url: '/ncs/spreadchain/page',
+        method: 'POST',
+        data: params,
+        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
+    })
+}
+
+export function remove(id) {
+    return request({
+        url: `/ncs/spreadchain/${id}`,
+        method: 'DELETE',
+        loading: true
+    })
+}
+/** 修改 */
+export function update(id, params) {
+    return request({
+        url: `/ncs/spreadchain/${id}`,
+        method: 'put',
+        data: params
+    })
+}
+/** 新增 */
+export function add(params) {
+    return request({
+        url: '/ncs/spreadchain',
+        method: 'POST',
+        loading: true,
+        data: params,
+        headers: { 'Content-Type': 'application/json' }
+    })
+}

src/api/role.js

@@ -60,3 +60,18 @@ export function editRole(id, params) {
     data: params
   })
 }
+
+/**
+ * 获取代码中角色枚举类型
+ * @param id
+ */
+export function getRoleEnums() {
+  return request({
+    url: `/mgr/role/rolenums`,
+    method: 'get'
+  })
+}
+
+
+
+

src/router/index.js

@@ -155,10 +155,25 @@ export const partRoutes = [
         path: 'users',
         component: () => import('@/views/entrace-guard/users'),
         name: 'users',
-        meta: { title: i18n.t('tab.entraceguardUser'), icon: 'pass_through', noCache: true }
+        meta: {title: i18n.t('tab.entraceguardUser'), icon: 'pass_through', noCache: true}
+      }]
+
+  },
+  {
+    path: '/ncs-clerk-frame-manage',
+    component: Layout,
+    redirect: '/ncs-clerk-frame-manage/index',
+    children: [
+      {
+        path: 'clerkList',
+        component: () => import('@/views/ncs-clerk-frame-manage/index'),
+        name: 'clerkList',
+        meta: {title: i18n.t('tab.staffManageFrames'), icon: 'frame_manage', noCache: true}
+
       }
     ]
   },
+
   // {
   //   path: '/customer',
   //   component: Layout,
@@ -318,6 +333,7 @@ export const partRoutes = [
       }
     ]
   },
+
   // {
   //   path: '/calling-message',
   //   component: Layout,
@@ -331,6 +347,7 @@ export const partRoutes = [
   //     }
   //   ]
   // },
+
   {
     path: '',
     component: Layout,
@@ -480,6 +497,32 @@ export const partRoutes = [
     ]
   },
   {
+    path: '/function-mapping',
+    component: Layout,
+    redirect: '/function-mapping/index',
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/function-mapping/index'),
+        name: 'functionMapping',
+        meta: { title: i18n.t('tab.functionRoleMapping'), icon: 'function', noCache: true }
+      }
+    ]
+  },
+  {
+    path: '/interaction-chain',
+    component: Layout,
+    redirect: '/interaction-chain/index',
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/interaction-chain/index'),
+        name: 'interactionChain',
+        meta: { title: i18n.t('tab.interactionChain'), icon: 'squence', noCache: true }
+      }
+    ]
+  },
+  {
     path: '/calling-setting',
     component: Layout,
     redirect: '/calling-setting/index',

src/utils/mixin.js

@@ -35,9 +35,10 @@ export default {
           picker.$emit('pick', [start, end])
         }
       }],
-      mainAreaHeight: Number(document.documentElement.clientHeight) - 84
+      mainAreaHeight:Number(document.documentElement.clientHeight) - 84
     }
   },
+
   computed: {
     /**
      * 缓存页面数组
@@ -46,6 +47,7 @@ export default {
     cachedViews() {
       return this.$store.state.tagsView.cachedViews
     },
+
     /**
      * 返回默认时间 + 5分钟
      * 用于日期时间选择器的默认时间
@@ -64,8 +66,9 @@ export default {
     }
   },
   methods: {
-    /** 返回克隆后的对象 */
 
+
+    /** 返回克隆后的对象 */
     MixinClone(obj) {
       return JSON.parse(JSON.stringify(obj))
     },

src/views/function-mapping/components/RoleForFunction.vue

@@ -0,0 +1,143 @@
+<template>
+    <div>
+        <el-card>
+
+            <fieldset style="margin-top: 10px">
+                <legend><span
+                        style="margin-right: 10px">{{this.$t('functionRoleMapping.configurateLeft')+this.$t(functions.language_dependence_code)+this.$t('functionRoleMapping.configurateRight')}}</span>
+                    <el-checkbox v-model="allCkeck" style="float: right;" :indeterminate="indeterminate"
+                                 @change="(checked)=>{handleCheckAll(checked)}">{{ this.$t('action.choiceAll') }}
+                    </el-checkbox>
+                </legend>
+                <el-row :gutter="20" type="flex" style="padding: 10px">
+                    <el-col :span="24">
+                        <el-checkbox v-for="(role,_index) in roles" :key="_index" v-model="role.checked"
+                                     @change="handleCheckboxChanged(role)">{{ role.role_name }}
+                        </el-checkbox>
+                    </el-col>
+                </el-row>
+            </fieldset>
+
+
+            <div align="center" class="margin-top-sm">
+                <el-button type="success" @click="handlerSubscribeSubmit">{{ this.$t('action.saveSettings') }}
+                </el-button>
+
+            </div>
+
+
+        </el-card>
+
+    </div>
+</template>
+
+<script>
+    import * as API_Role from '@/api/role'
+    import * as API_FunctionRoleMapping from '@/api/ncs_functions_role_mapping'
+
+    export default {
+        name: "RoleForFunction",
+        props: {
+            functions: {
+                type: Object,
+                default: () => {
+                }
+            }
+        },
+        data() {
+            return {
+                allCkeck: false,
+                roles: [],
+                indeterminate: false,
+                functionRoleMapping: {}
+            }
+        },
+       async mounted() {
+            this.roles = await API_Role.getRoleList(-1)
+            this.getFunctionsRoleMappingByCodeAndPartId()
+        },
+        methods: {
+            handleCheckboxChanged(role) {
+
+                this.caculateCheckAllState()
+            },
+            handleCheckAll(checked) {
+                this.roles.forEach(item => {
+                    this.$set(item, 'checked', checked)
+                })
+                this.caculateCheckAllState()
+            },
+
+            caculateCheckAllState(){
+                const checkedLength = this.roles.filter(p => p.checked).length
+                this.allCkeck = checkedLength === this.roles.length
+                this.indeterminate = checkedLength !== 0 && checkedLength !== this.roles.length
+            },
+
+            // getRoleList() { // roleEdit 保存成功时回调会传入当前role实体，新增时需要根据当前role选择新添加的角色
+            //     API_Role.getRoleList(-1).then(res => {
+            //         this.roles = [...res]
+            //     }).catch(err => {
+            //         this.$error(err.message)
+            //     })
+            // },
+            getFunctionsRoleMappingByCodeAndPartId() {
+                API_FunctionRoleMapping.getFunctionsRoleMappingByCodeAndPartId(this.functions.function_code, this.$store.getters.partId).then(res => {
+                    if (res !== null && res !== '') {
+                        this.functionRoleMapping = {...res}
+                        const roleids = res.role_ids.split(',').map(p=>Number(p))
+                        this.roles.forEach(item => {
+                            this.$set(item, 'checked', roleids.includes(item.role_id))
+                        })
+
+                        this.caculateCheckAllState()
+                    }
+                }).catch(err => {
+                    this.$message.error(err.message)
+                })
+            },
+            handlerSubscribeSubmit() {
+
+                const checkedRoleId = this.roles.filter(p => p.checked).map(p => p.role_id).join(',')
+                if(Object.keys(this.functionRoleMapping).length>0){
+                    this.functionRoleMapping.role_ids =checkedRoleId
+                }
+                else{
+                    this.functionRoleMapping={
+                        function_code:this.functions.function_code,
+                        part_id:this.$store.getters.partId,
+                        function_id:this.functions.id,
+                        role_ids:checkedRoleId
+                    }
+                }
+                if(this.functionRoleMapping.id!==null&&this.functionRoleMapping.id!==undefined){
+                    API_FunctionRoleMapping.update(this.functionRoleMapping.id,this.functionRoleMapping).then(res=>{
+                     this.functionRoleMapping={...res}
+                        this.$message.success(this.$t('action.settingsSuccess'))
+                    }).catch(err=>{
+                        this.$message.error(err.message)
+                    })
+                }else{
+                    API_FunctionRoleMapping.add(this.functionRoleMapping).then(res=>{
+                        this.functionRoleMapping={...res}
+                        this.$message.success(this.$t('action.settingsSuccess'))
+                    }).catch(err=>{
+                        this.$message.error(err.message)
+                    })
+                }
+
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    fieldset {
+        border: 1px solid #DCDFE6;
+        border-radius: 5px;
+    }
+
+    .margin-top-sm {
+        margin-top: 20px;
+    }
+</style>

src/views/function-mapping/index.vue

@@ -0,0 +1,43 @@
+<template>
+    <div class="app-container">
+        <el-tabs tab-position="left" :style="{height: (mainAreaHeight-40)+'px'}">
+            <el-tab-pane :label="$t(item.language_dependence_code)" v-for="(item,index) in functions" :key="index">
+                <role-for-function :functions="item"></role-for-function>
+            </el-tab-pane>
+
+
+        </el-tabs>
+    </div>
+</template>
+
+<script>
+    import * as API_Function from '@/api/ncs_functions'
+    import RoleForFunction from "./components/RoleForFunction";
+    export default {
+        name: "index",
+        components: {RoleForFunction},
+        data(){
+            return{
+                functions:[]
+            }
+        },
+        mounted(){
+            this.getAllFunctions()
+        },
+        methods:{
+            getAllFunctions(){
+                API_Function.getAll().then(
+                    res=>{
+                        this.functions=[...res]
+                    }
+                ).catch(err=>{
+                    this.$error(err.message)
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>

src/views/hospitalFrame/nurse_watch_frame.vue

@@ -181,6 +181,7 @@ export default {
       if (this.roleId === 8) {
         API_hospitalFrame.getFrameByRoleGroupId(this.$store.getters.partId, this.memberId).then(res => {
           _this.rooms = _this.filterGroupFrames(res)
+
           const room_group = groupBy(_this.rooms, item => item.group_name)
           _this.roomGroup = Object.entries(room_group)
           console.log(_this.roomGroup)
@@ -188,6 +189,7 @@ export default {
       } else {
         API_hospitalFrame.getFrameByRoleId(this.$store.getters.partId, this.roleId).then(res => {
           _this.rooms = _this.filterGroupFrames(res)
+          console.log('rooms',_this.rooms)
           const room_group = groupBy(_this.rooms, item => item.group_name)
           _this.roomGroup = Object.entries(room_group)
         })

src/views/interaction-chain/index.vue

@@ -0,0 +1,552 @@
+<template>
+    <div>
+        <ag-grid-layout
+                toolbar
+                :table-height="tableHeight"
+                theme="ag-theme-alpine"
+                :column-defs="columnDefs"
+                :row-data="rowData"
+                :locale-text="localeText"
+                :grid-options="gridOptions"
+                :default-col-def="defaultColDef"
+                :animate-rows="true"
+                :row-selection="rowSelection"
+                :enable-cell-change-flash="true"
+                @filterChanged="filterModifed"
+                @sortChanged="gridSortChange"
+        >
+            <!--        @rowDoubleClicked="getList"-->
+            <div slot="toolbar" class="inner-toolbar">
+                <div class="toolbar-search">
+                    <en-table-search :placeholder="this.$t('action.keywords')" @search="handlerSearch" />
+                </div>
+                <div class="toolbar-btns">
+                    <el-button type="primary" size="mini" @click="createBroadcast">{{ this.$t('action.add') }}</el-button>
+                </div>
+            </div>
+            <el-pagination
+                    v-if="pageData"
+                    slot="pagination"
+                    :current-page="pageData.page_no"
+                    :page-sizes="[10, 20, 50, 100]"
+                    :page-size="pageData.page_size"
+                    layout="total, sizes, prev, pager, next, jumper"
+                    :total="pageData.data_total"
+                    @size-change="handlePageSizeChange"
+                    @current-change="handlePageCurrentChange"
+            />
+        </ag-grid-layout>
+
+
+
+        <el-dialog :title.sync="formtitle" :visible.sync="formshow" width="55%">
+            <div>
+                <el-form ref="editform" :rules="rules" label-width="120px" :model="formmodel">
+
+                    <el-form-item :label="this.$t('interactionChain.ActionType')" prop="action_type">
+                        <el-select v-model="formmodel.action_type"
+                                   clearable >
+                            <el-option v-for="(item,index) in interactionTypes" :key="index" :label="item.key" :value="item.value"/>
+                        </el-select>
+                    </el-form-item>
+                    <el-row>
+                        <el-col :span="24" >
+                            <el-form-item :label="this.$t('interactionChain.AcceptSequence')" prop="role_path">
+                            <el-transfer
+                                    filterable
+                                    :filter-method="filterMethod"
+                                    :titles="[this.$t('interactionChain.AllRoles'), this.$t('interactionChain.AcceptRoles')+'('+this.$t('interactionChain.NoticeSequence')+')']"
+                                    :filter-placeholder="this.$t('interactionChain.SearchPlaceHolder')"
+                                    v-model="role_path"
+                                    :props="{key:'role_id',label:'role_name'}"
+                                    :data="role_data"
+                                    target-order="push"
+                            @change="roleDataChange"
+                            >
+                            </el-transfer>
+
+
+</el-form-item>
+                        </el-col>
+
+                    </el-row>
+                    <el-row>
+                        <el-col :span="24">
+                            <h3>{{this.$t('interactionChain.sketchMap')}}</h3>
+                            <el-steps  finish-status="success">
+
+                                <el-step :title="item.role_name" v-for="(item,index) in role_path_step" :key="index" status="finish"></el-step>
+
+                            </el-steps>
+                        </el-col>
+                    </el-row>
+                </el-form>
+
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="formshow = false">{{ this.$t('action.cancel') }}</el-button>
+                <el-button type="primary" @click="handlerFormSubmit('editform')">{{ this.$t('action.yes') }}</el-button>
+            </div>
+        </el-dialog>
+    </div>
+
+</template>
+
+<script>
+    import { AG_GRID_LOCALE_CN } from '@/utils/AgGridVueLocaleCn'
+    import ButtonCellRenderList from '@/components/AgGridCellRender/ButtonCellRenderList'
+    import * as API_InteractionChain from '@/api/ncs_interaction-chain'
+    import ListFilter from '@/components/AgGridCustomFilter/ListFilter'
+    import RadioFilter from '@/components/AgGridCustomFilter/RadioFilter'
+    const serverUrl = domain.serverUrl
+    const DeviceUrl = domain.DeviceUrl
+    import * as API_FunctionRoleMapping from '@/api/ncs_functions_role_mapping'
+    import * as API_Role from '@/api/role'
+    import i18n from "../../utils/i18n";
+    const customer={role_name:i18n.t('interactionChain.Customer') ,role_id:0}
+    const nurse_host={role_name:i18n.t('interactionChain.NURSE_HOST'),role_id:-1}
+    export default {
+        name: 'Index',
+        components: { ButtonCellRenderList, ListFilter, RadioFilter },
+        data() {
+            return {
+                tableData: [],
+                role_data:[],
+                role_path:[],
+                role_path_step:[customer,nurse_host],
+                /** 列表参数 */
+                params: {
+                    page_size: 20,
+                    page_no: 1,
+                    fixedCondition: ' part_id = ' + this.$store.getters.partId
+                },
+                /** 新建组织弹出参数 **/
+                formtitle: this.$t('interactionChain.AddInteractionSpreadPath'),
+                formshow: false,
+                formmodel: {
+                    repeat_times: 1,
+                    group_ids: []
+                },
+                rules: {
+                    action_type: [
+                        { required: true, message: this.$t('interactionChain.chooseActionTypeTip'), trigger: 'blur' }
+                    ],
+                    role_path:[{
+                        required: true,
+                        validator: (rule, value, callback) => {
+                            console.log('rule',value)
+                            if (this.role_path.length>0) {
+                                callback()
+                            } else {
+                                callback(new Error(this.$t('interactionChain.chooseRoleSquence')))
+                            }
+                        },
+                        trigger: 'change'
+                    }]
+                },
+                /** ag-grid参数 **/
+                pageData: [],
+                loading: false,
+                errorId: null,
+                columnDefs: null,
+                rowData: null,
+                defaultColDef: null,
+                gridOptions: null,
+                gridApi: null,
+                columnApi: null,
+                localeText: AG_GRID_LOCALE_CN,
+                filterState: null,
+                rowSelection: null,
+                frameworkComponents: null,
+                manageBedRole:{},
+                canManageBedRoleIds:[],
+                canManageBedRole:[],
+                interactionTypes:[{
+                    key:this.$t('tcpType.EVENT'),
+                    value:'EVENT'
+                },{
+                    key:this.$t('tcpType.VOICE'),
+                    value:'VOICE'
+                },{
+                    key:this.$t('tcpType.VIDEO'),
+                    value:'VIDEO'
+                },{
+                    key:this.$t('tcpType.IM'),
+                    value:'IM'
+                }]
+            }
+        },
+        computed: {
+            tableHeight() {
+                return this.mainAreaHeight - 130
+            }
+        },
+        beforeMount() {
+            this.gridOptions = {}
+            this.columnDefs = [
+                {
+                    headerName: '#',
+                    headerCheckboxSelection: true,
+                    headerCheckboxSelectionFilteredOnly: true,
+                    checkboxSelection: true,
+                    sortable: false, filter: false,
+                    width: 100,
+                    resizable: false,
+                    valueGetter: this.hashValueGetter
+                },
+                { headerName: 'ID', field: 'id', sortable: true, filter: 'agNumberColumnFilter', width: 130 },
+                {
+                    headerName: this.$t('interactionChain.ActionType'), field: 'action_type', sortable: true, filterFramework: 'ListFilter', filterParams: {
+                        listData: this.interactionTypes
+                    }, width: 180,
+                    valueGetter: this.actionTypeGetter
+
+                },
+                {
+                    headerName: this.$t('interactionChain.FirstRole'), field: 'first_role_id', sortable: true, filterFramework: 'ListFilter', filterParams: {
+                        listData: this.canManageBedRole
+                    }, width: 180, cellRenderer: this.firstRoleFormatter
+                },
+                {
+                    headerName: this.$t('interactionChain.SpreadRoleNamePath'), field: 'spread_role_name_path', sortable: true, filter: 'agTextColumnFilter',
+                    flex:1,
+                    cellRenderer: this.chainFormatter
+                },
+
+                {
+                    headerName: this.$t('action.edit'), field: 'shop_id',
+                    cellRendererFramework: 'ButtonCellRenderList',
+                    cellRendererParams: param => {
+                        return {
+                            list: [
+                                {
+                                    onClick: this.handEdit,
+                                    label: this.$t('action.edit'),
+                                    buttonType: 'primary',
+                                    buttonSize: 'mini'
+                                },
+                                {
+                                    onClick: this.deleteSingle,
+                                    label: this.$t('action.delete'),
+                                    buttonType: 'danger',
+                                    buttonSize: 'mini'
+                                }
+                            ]}
+                    },
+                    filter: false,
+                    pinned: 'right',
+                    lockPinned: true,
+                    width: this.$i18n.locale === 'zh' ? 290 : 300,
+                    resizable: false,
+                    sortable: false
+                }
+            ]
+            this.defaultColDef = {
+                sortable: true,
+                resizable: true,
+                comparator: this.dateCustomComparator,
+                filterParams: {
+                    debounceMs: 200,
+                    newRowsAction: 'keep',
+                    textCustomComparator: this.textCustomComparator,
+                    comparator: this.dateCustomComparator
+                }
+            }
+            this.rowSelection = 'multiple'
+        },
+       async mounted() {
+
+           this.manageBedRole = await API_FunctionRoleMapping.getFunctionsRoleMappingByCodeAndPartId('MANAGE_BED', this.$store.getters.partId)
+           const {role_ids} = this.manageBedRole
+           if(role_ids!==undefined){
+               this.canManageBedRoleIds = role_ids.split(',').map(p=>Number(p))
+           }
+            window.onresize = this.windowResize
+            this.gridApi = this.gridOptions.api
+            this.gridColumnApi = this.gridOptions.columnApi
+            // 设置默认排序字段，应用列状态之后会触发 gridSortChange 函数，会调用getlist，后面不需要再调用this.getlist
+            this.gridColumnApi.applyColumnState({
+                state: [
+                    {
+                        colId: 'id',
+                        sort: 'asc'
+                    }
+                ]
+            })
+            this.getRoleList()
+
+
+
+        },
+        methods: {
+            windowResize() {
+                this.$set(this, 'mainAreaHeight', Number(document.documentElement.clientHeight) - 84)
+            },
+           getRoleList(){
+               API_Role.getRoleList(-1).then(res => {
+
+                    res.forEach(item=>{
+                        this.$set(item,'can_manage_bed',this.canManageBedRoleIds.includes(item.role_id))
+                        })
+                   this.role_data=[...res]
+                   this.canManageBedRole =[...res.filter(p=>p['can_manage_bed']).map(p=>{return {'key':p.role_name,'value':p.role_id}})]
+                   this.columnDefs[3].filterParams.listData=this.canManageBedRole
+                   this.gridApi.setColumnDefs(this.columnDefs);
+                   this.setRoleStatus()
+                    console.log(this.role_data)
+               })
+           },
+           setRoleStatus(){
+               let allRoleIds= this.role_data.map(p=>p.role_id)
+               let disabledRoleIds=[] //要被禁止的ids
+               if(this.role_path.length==0){ //没有选择任何项，只需把不管床的角色禁用
+                   disabledRoleIds = this.role_data.filter(p=>!p['can_manage_bed']).map(p=>p.role_id)
+               }else{
+                   let choosedNoManageBed = this.role_path.filter(p=>!new Set(this.canManageBedRoleIds).has(p))
+                   let choosedManageBed = this.role_path.filter(p=>new Set(this.canManageBedRoleIds).has(p))
+                   if(choosedNoManageBed.length===this.role_path){ //选择的都不能管床，有问题
+                       disabledRoleIds=[]
+                       this.role_path=[]
+                   }else if(choosedNoManageBed.length>0){
+                     disabledRoleIds=[...choosedManageBed]
+                   }
+
+               }
+
+                this.role_data.forEach(item=>{
+                        this.$set(item,'disabled',disabledRoleIds.includes(item.role_id))
+                })
+           },
+            handlerDelete(ids) {
+                this.$confirm(this.$t('action.sureDelete'), this.$t('action.waring'), {
+                    confirmButtonText: this.$t('action.yes'),
+                    cancelButtonText: this.$t('action.cancel'),
+                    type: 'warning'
+                }).then(() => {
+                    API_InteractionChain.remove(ids).then(
+                        response => {
+                            this.$message({
+                                type: 'success',
+                                message: this.$t('action.deleted')
+                            })
+                            this.getList()
+                        }
+                    ).catch(response => {
+                        this.$message({
+                            type: 'info',
+                            message: response.message
+                        })
+                    })
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: this.$t('action.cancelDelete')
+                    })
+                })
+            },
+            filterMethod(query,item){
+                return item.role_name.indexOf(query) > -1;
+            },
+            deleteSingle(row) {
+                this.handlerDelete(row.id)
+            },
+
+
+            /** 获取交互类型文字显示,从deviceTypeTransfer 中找出value值对应的key显示出来 */
+            actionTypeGetter(params) {
+                const gridVal = params.data.action_type
+                // return this.deviceTypeTransfer.filter(p => p.value === gridVal).map(p => p.key)
+                return this.interactionTypes.filter(p=>p.value===gridVal).map(p=>p.key)[0]
+            },
+            /**
+             * 创建接收顺序
+             */
+            createBroadcast() {
+                delete this.formmodel.id
+                this.formmodel={
+
+                }
+                this.role_path=[]
+                this.role_path_step=[customer,nurse_host]
+                this.setRoleStatus()
+                this.formshow = true
+            },
+            /** 分页大小发生改变 */
+            handlePageSizeChange(size) {
+                this.params.page_size = size
+                this.getList()
+            },
+            /** 分页页数发生改变 */
+            handlePageCurrentChange(page) {
+                this.params.page_no = page
+                this.getList()
+            },
+            /** 加载列表数据 */
+            getList() {
+                this.loading = true
+                const param = this.MixinClone(this.params)
+                this.gridApi.showLoadingOverlay()
+                API_InteractionChain.getList(param).then(response => {
+                    this.loading = false
+                    // this.tableData = [...response.data]
+                    this.pageData = {
+                        page_no: response.page_no,
+                        page_size: response.page_size,
+                        data_total: response.data_total
+                    }
+                    this.$nextTick(() => {
+                        const node = this.gridApi.getDisplayedRowAtIndex(0)
+                        if (node !== null && node !== undefined) {
+                            node.setSelected(true)
+                        }
+                    })
+                    this.rowData = [...response.data]
+                    this.refreshPlayStatus()
+                }).catch(() => {
+                    this.loading = false
+                })
+            },
+            /** 处理搜索 */
+            handlerSearch(keywords) {
+                this.params.query = keywords
+                this.getList()
+            },
+            /** 处理字段排序 */
+            tableSort(column) {
+                if (column.order !== null) {
+                    this.params.sort = column.prop
+                    this.params.dir = column.order === 'ascending' ? 'asc' : 'desc'
+                } else {
+                    this.params.sort = null
+                    this.params.dir = null
+                }
+                this.getList()
+            },
+
+            chainFormatter(params){
+                return params.value.replaceAll(',','<i class="el-icon-right"></i>')
+            },
+            firstRoleFormatter(params) {
+                console.log('para', params)
+                // return
+               return params.data.spread_role_name_path.split(',')[0]
+
+            },
+
+            gridSortChange(param) {
+                const columnState = param.columnApi.getColumnState()
+                // 排序状态
+                const sortState = columnState.filter(function(s) {
+                    return s.sort != null
+                }).map(function(s) {
+                    return {
+                        colId: s.colId,
+                        sort: s.sort,
+                        sortIndex: s.sortIndex
+                    }
+                }).sort(function(a, b) {
+                    return a.sortIndex - b.sortIndex
+                })
+                if (sortState.length > 0) {
+                    if (sortState.length === 1) {
+                        this.params.sort = sortState[0].colId
+                        this.params.dir = sortState[0].sort
+                    } else {
+                        let sortstring = ''
+                        sortState.forEach(function(item) {
+                            sortstring += item.colId + ' ' + item.sort + ','
+                        })
+                        this.params.sort = sortstring.substring(0, sortstring.length - 1)
+                        this.params.dir = ' '
+                    }
+                } else {
+                    delete this.params.sort
+                    delete this.params.dir
+                }
+
+                this.getList()
+                // console.log(sortState)
+            },
+            filterModifed(param) { // todo 通过转换后的数值过滤，需要转回原始数值
+                // console.log(param)
+                var model = param.api.getFilterModel()
+                // console.log('model', JSON.stringify(model))
+                this.params.filter = JSON.stringify(model)
+                this.getList()
+            },
+            handEdit(row) {
+               this.formmodel ={
+                   ...row
+               }
+               this.role_path=row.spread_role_path.split(',').map(p=>Number(p))
+
+                this.roleDataChange(this.role_path)
+
+                this.setRoleStatus()
+               this.formshow=true
+
+            },
+            /**
+             * 提交新增表单
+             * @param formname
+             */
+            handlerFormSubmit(formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        this.formmodel.part_id = this.$store.getters.partId
+                        this.formmodel.spread_role_path = this.role_path.join(',')
+                        this.formmodel.first_role_id = this.role_path[0]
+                        let chosedRoleName = []
+                        this.role_path.forEach(item => {
+                            chosedRoleName.push(this.role_data.filter(p => item === p.role_id).map(p => p.role_name))
+                        })
+                        this.formmodel.spread_role_name_path = chosedRoleName.join(',')
+                        if (this.formmodel.id === undefined) {
+                            /** 新增 */
+
+                            API_InteractionChain.add(this.formmodel).then(result => {
+                                console.log(result)
+                                this.formshow = false
+                                this.$message.success(this.$t('action.saveSuccess'))
+                                this.getList()
+                            })
+                        }else{
+                         API_InteractionChain.update(this.formmodel.id,this.formmodel).then(res=>{
+                             this.formshow = false
+                             this.$message.success(this.$t('action.saveSuccess'))
+                             this.getList()
+                         }).catch(err=>{
+                             this.$message.error(err.message)
+                         })
+                        }
+                    } else {
+                        this.$message.error(this.$t('action.fromError'))
+                    }
+
+                })
+            },
+
+            roleDataChange(val){
+                console.log(val)
+                let  chosedRole =[]
+                val.forEach(item=>{
+                    chosedRole.push(this.role_data.filter(p=>item===p.role_id)[0])
+                })
+                console.log(chosedRole)
+                this.role_path_step=[customer,...chosedRole,nurse_host]
+                this.setRoleStatus()
+            },
+
+
+        }
+    }
+    </script>
+
+<style scoped>
+
+/deep/
+.el-transfer-panel{
+    width:300px
+}
+
+</style>

src/views/ncs-auth/compontents/roleEdit.vue

@@ -51,6 +51,21 @@
           </el-row>
         </div>
       </el-form-item>
+
+      <el-form-item :label="this.$t('role.leaderRole')">
+        <el-select v-model="permissionForm.leader_role_id" :placeholder="this.$t('role.leaderRolePlaceholder')" clearable>
+          <!--                <el-option v-for="item in sosDeviceSettingsTypeOptions" :key="item.value" :label="item.key" :value="item.value" />-->
+          <el-option v-for="(item, index) in leaderRoles" :key="index" :label="item.role_name" :value="item.role_id" />
+        </el-select>
+      </el-form-item>
+
+      <el-form-item :label="this.$t('role.roleEnum')">
+        <el-select v-model="permissionForm.role_type" :placeholder="this.$t('role.roleEnumPlaceholder')" clearable>
+          <!--                <el-option v-for="item in sosDeviceSettingsTypeOptions" :key="item.value" :label="item.key" :value="item.value" />-->
+          <el-option v-for="(item, index) in roleTypeEnums" :key="index" :label="item.key" :value="item.key" />
+        </el-select>
+      </el-form-item>
+
       <el-form-item label="">
         <el-button type="primary" size="small" style="margin-top: 15px" @click="saveRolePermission">{{ this.$t('action.saveSettings') }}</el-button>
       </el-form-item>
@@ -69,6 +84,11 @@ export default {
       type: Number,
       required: true,
       default: 0
+    },
+    allRoles:{
+      type:Array,
+      require:true,
+      default:()=>[]
     }
   },
   data() {
@@ -90,15 +110,22 @@ export default {
       // 全选状态
       allCheck: false,
       // 全选不确定状态
-      allIndeterminate: false
+      allIndeterminate: false,
+      roleTypeEnums:[]
     }
   },
   watch: {
     role_id: 'GET_RolePermission'
   },
-  mounted() {
+  async mounted() {
     // this.role_id = Number(this.$route.params.id)
     this.GET_RolePermission()
+    this.roleTypeEnums = await API_Auth.getRoleEnums()
+  },
+  computed:{
+    leaderRoles(){
+      return this.allRoles.filter(p=>p.role_id!==this.role_id)
+    }
   },
   methods: {
     /** 全选 */
@@ -193,6 +220,8 @@ export default {
           API_Auth.getRolePermission(this.role_id).then(response => {
             this.permissionForm.role_name = response.role_name
             this.permissionForm.role_describe = response.role_describe
+            this.$set(this.permissionForm,'role_type',response.role_type)
+            this.$set(this.permissionForm,'leader_role_id',response.leader_role_id)
             // this.permissionForm.hidden_in_seller = response.hidden_in_seller
             const checkedIds = this.expandRouters(response.menus)
             this.$set(this, 'permissions', this.filterRoleRouter(res, checkedIds))

src/views/ncs-auth/superadmin/defaultRoleManager.vue

@@ -23,7 +23,7 @@
           <el-button :disabled="role_id === 0" type="success" size="mini" @click="roleEvent">{{ this.$t('role.roleEvent') }}</el-button>
           <el-button :disabled="role_id === 0" type="danger" size="mini" @click="deleteRole">{{ this.$t('role.roleDelete') }}</el-button>
         </el-header>
-        <role-edit :role_id="role_id" @aftersave="getRoleList" />
+        <role-edit :role_id="role_id" :all-roles="tableData" @aftersave="getRoleList" />
       </el-main>
     </el-container>
     <el-dialog :title="this.$t('role.roleEdit')" :visible.sync="formShow" width="50%">
@@ -62,6 +62,7 @@ export default {
       allCheck: false,
       newCheckList: [],
       oldCheckList: []
+
     }
   },
   computed: {

src/views/ncs-channel/index.vue

@@ -532,6 +532,7 @@ export default {
         _this.nurses.forEach(item => {
           this.channelSubscribers.push({ 'roleName': item[0], 'clerks': item[1].map(i => { return { ...i, 'checked': false } }), 'allCheck': false, 'indeterminate': false })
         })
+
       })
     },
     handleCheckboxChanged(item) {

src/views/ncs-clerk-frame-manage/components/employeeView.vue

@@ -0,0 +1,480 @@
+<template>
+    <el-container :style="{height: asideHeight+'px'}">
+        <el-aside width="220px" style="overflow: hidden">
+            <el-scrollbar wrap-class="scrollbar-wrapper">
+                <el-menu
+                        default-active="0-0"
+                        class="el-menu-vertical-demo"
+                        @open="handleOpen"
+                        @select="handleSelect"
+                        @close="handleClose"
+                >
+                    <el-submenu v-for="(key,index) in Object.keys(clerks)" :index="index+''" :key="index">
+                        <template slot="title">
+                            <svg-icon icon-class="role"/>
+                            <span>{{key}}</span>
+                        </template>
+                        <el-menu-item-group v-if="clerks[key].length>0">
+                            <el-menu-item :index="index+'-'+_idx" v-for="(item,_idx) in clerks[key]" :key="_idx">
+                                {{item.clerk_name}}
+                            </el-menu-item>
+                        </el-menu-item-group>
+                    </el-submenu>
+                </el-menu>
+
+            </el-scrollbar>
+
+        </el-aside>
+        <el-main :style="{height: (asideHeight-16)+'px'}">
+            <el-tabs v-model="activeName" type="border-card">
+                <el-tab-pane :label="this.$t('clerkFrameManage.managedFrames')" name="first">
+                    <div class="inner-toolbar">
+                        <div class="toolbar-search">
+                            <en-table-search :placeholder="this.$t('action.keywords')" @search="(keyword)=>handlerSearchManaged(keyword,1)"/>
+                        </div>
+                    </div>
+                    <el-tabs v-model="activeName2" class="inner-tab-panel" tab-position="left">
+
+                        <el-tab-pane :label="$t('watch.allFrame')" name="allManaged">
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-171)+'px'}">
+                                <div style="padding: 0 15px">
+                                    <!--        <fieldset class="margin-top-sm">-->
+                                    <!--          <legend>{{ watchDeviceFrame }}</legend>-->
+                                    <el-row :gutter="20" type="flex">
+                                        <el-col v-for="(item,index) in clerkManageFrame.managed_frames" :key="index"
+                                                :xs="8" :sm="8" :md="6" :lg="4" :xl="4">
+                                            <el-card class="box-card">
+                                                <div  slot="header" class="clearfix">
+
+                                                        <svg-icon icon-class="sickroom"
+                                                                  style="color: #9aaabf;margin-right: 5px"/>
+                                                        <span>{{ item.name }}</span>
+
+                                                    <el-checkbox v-model="item.allCkeck" style="float: right"
+                                                                 :indeterminate="item.indeterminate"
+                                                                 :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                                 @change="(checked)=>{handleCheckAll(checked,item)}">
+                                                        {{ $t('action.choiceAll') }}
+                                                    </el-checkbox>
+                                                </div>
+                                                <div v-for="(bed,_index) in item.children" :key="_index"
+                                                     class="text item">
+                                                    <el-checkbox
+                                                            v-model="bed.checked"
+                                                                 :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                                 @change="handleCheckboxChanged(item)">
+                                                        <svg-icon icon-class="bed"
+                                                                  style="color: #9aaabf;margin-right: 5px"/>
+                                                        <span v-if="bed.device_id && !bed.checked"
+                                                              style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>
+                                                        <span v-else>{{ bed.full_name }}</span>
+                                                    </el-checkbox>
+                                                </div>
+                                            </el-card>
+                                        </el-col>
+                                    </el-row>
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+
+                        <el-tab-pane v-for="(group,idx) in managedRoomGroup" v-if="group[0]!=='null'" :key="idx"
+                                     :label="group[0]" :name="'zone-'+idx">
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-171)+'px'}">
+                                <div style="padding: 0 15px">
+                            <el-row v-if="group[1].length > 1" :gutter="20" type="flex">
+                                <el-col v-for="(item,index) in group[1]" :key="index" :xs="6" :sm="6" :md="4" :lg="4"
+                                        :xl="4">
+                                    <el-card class="box-card">
+                                        <div slot="header" class="clearfix">
+
+                                                <svg-icon icon-class="sickroom"
+                                                          style="color: #9aaabf;margin-right: 5px"/>
+                                                <span>{{ item.name }}</span>
+
+                                            <el-checkbox v-model="item.allCkeck" style="float: right"
+                                                         :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                         :indeterminate="item.indeterminate"
+                                                         @change="(checked)=>{handleCheckAll(checked,item)}">
+                                                {{ $t('action.choiceAll') }}
+                                            </el-checkbox>
+                                        </div>
+                                        <div v-for="(bed,_index) in item.children" :key="_index" class="text item">
+                                            <el-checkbox v-model="bed.checked" :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')">
+                                                <svg-icon icon-class="bed" style="color: #9aaabf;margin-right: 5px"/>
+                                                <span v-if="bed.device_id && !bed.checked" style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>
+                                                <span v-else>{{ bed.full_name }}</span>
+                                            </el-checkbox>
+                                            <!--                                        <div v-if="roleId === 8">-->
+                                            <!--                                            <svg-icon icon-class="bed" style="color: #9aaabf;margin-right: 5px" />-->
+                                            <!--                                            <span v-if="bed.device_id && !bed.checked" style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>-->
+                                            <!--                                            <span v-else>{{ bed.full_name }}</span>-->
+                                            <!--                                        </div>-->
+                                        </div>
+                                    </el-card>
+                                </el-col>
+                            </el-row>
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+                    </el-tabs>
+                    <div class="margin-top-xs text-center padding-content">
+                        <el-row>
+                            <el-col :span="8"> <el-checkbox v-if="clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')" v-model="clerkManageFrameSource.bool_phone_acceptor">{{this.$t('clerkFrameManage.phoneAcceptorTipsLeft')}}{{clerkManageFrameSource.clerk_name}}{{this.$t('clerkFrameManage.phoneAcceptorTipsMid')}},{{clerkManageFrameSource.clerk_name}}{{this.$t('clerkFrameManage.phoneAcceptorTipsRight')}}</el-checkbox></el-col>
+                            <el-col :span="8"> <el-button type="primary" :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')" @click="saveClerkManageFrame">{{this.$t('action.saveSettings')}}</el-button></el-col>
+                            <el-col :span="8"></el-col>
+                        </el-row>
+
+                    </div>
+                </el-tab-pane>
+                <el-tab-pane :label="this.$t('clerkFrameManage.notManagedFrames')" name="second">
+                    <div class="inner-toolbar">
+                        <div class="toolbar-search">
+                            <en-table-search :placeholder="this.$t('action.keywords')" @search="(keyword)=>handlerSearchManaged(keyword,2)"/>
+                        </div>
+                    </div>
+                    <el-tabs v-model="activeName1" class="inner-tab-panel" tab-position="left">
+
+                        <el-tab-pane :label="$t('watch.allFrame')" name="allNoManange">
+
+                            <!--        <fieldset class="margin-top-sm">-->
+                            <!--          <legend>{{ watchDeviceFrame }}</legend>-->
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-171)+'px'}">
+                                <div style="padding: 0 15px">
+                                    <el-row :gutter="20" type="flex">
+
+                                        <el-col v-for="(item,index) in clerkManageFrame.no_manage_frames" :key="index"
+                                                :xs="8" :sm="8" :md="6" :lg="4" :xl="4">
+                                            <el-card class="box-card">
+                                                <div slot="header" class="clearfix">
+                                                    <svg-icon icon-class="sickroom"
+                                                              style="color: #9aaabf;margin-right: 5px"/>
+                                                    <span>{{ item.name }}</span>
+                                                    <span v-if="uiVersion !== 1"><svg-icon icon-class="sickroom"
+                                                                                           style="color: #9aaabf;margin-right: 5px"/><span>{{ item.name }}</span></span>
+                                                    <el-checkbox v-model="item.allCkeck" style="float: right"
+                                                                 :indeterminate="item.indeterminate" :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                                 @change="(checked)=>{handleCheckAll(checked,item)}">
+                                                        {{ $t('action.choiceAll') }}
+                                                    </el-checkbox>
+                                                </div>
+                                                <div v-for="(bed,_index) in item.children" :key="_index"
+                                                     class="text item">
+                                                    <el-checkbox v-model="bed.checked"
+                                                                 :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                                 @change="handleCheckboxChanged(item)">
+                                                        <svg-icon icon-class="bed"
+                                                                  style="color: #9aaabf;margin-right: 5px"/>
+                                                        <span v-if="bed.device_id && !bed.checked"
+                                                              style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>
+                                                        <span v-else>{{ bed.full_name }}</span>
+                                                    </el-checkbox>
+                                                    <!--                                            <div >-->
+                                                    <!--                                                <svg-icon icon-class="bed" style="color: #9aaabf;margin-right: 5px" />-->
+                                                    <!--                                                <span v-if="bed.device_id && !bed.checked" style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>-->
+                                                    <!--                                                <span v-else>{{ bed.full_name }}</span>-->
+                                                    <!--                                            </div>-->
+                                                </div>
+                                            </el-card>
+                                        </el-col>
+
+                                    </el-row>
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+
+                        <el-tab-pane v-for="(group,idx) in noManagedRoomGroup" v-if="group[0]!=='null'" :key="idx"
+                                     :label="group[0]" :name="'zone-'+idx">
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-171)+'px'}">
+                                <div style="padding: 0 15px">
+                                    <el-row v-if="group[1].length > 1" :gutter="20" type="flex">
+                                        <el-col v-for="(item,index) in group[1]" :key="index" :xs="8" :sm="8" :md="6"
+                                                :lg="4" :xl="4">
+                                            <el-card class="box-card">
+                                                <div slot="header" class="clearfix">
+                                                    <svg-icon icon-class="sickroom"
+                                                              style="color: #9aaabf;margin-right: 5px"/>
+                                                    <span>{{ item.name }}</span>
+                                                    <span v-if="uiVersion !== 1"><svg-icon icon-class="sickroom"
+                                                                                           style="color: #9aaabf;margin-right: 5px"/><span>{{ item.name }}</span></span>
+                                                    <el-checkbox v-model="item.allCkeck" style="float: right"
+                                                                 :indeterminate="item.indeterminate"
+                                                                 :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                                 @change="(checked)=>{handleCheckAll(checked,item)}">
+                                                        {{ $t('action.choiceAll') }}
+                                                    </el-checkbox>
+                                                </div>
+                                                <div v-for="(bed,_index) in item.children" :key="_index"
+                                                     class="text item">
+                                                    <el-checkbox v-model="bed.checked"
+                                                                 :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')"
+                                                                 @change="handleCheckboxChanged(item)">
+                                                        <svg-icon icon-class="bed"
+                                                                  style="color: #9aaabf;margin-right: 5px"/>
+                                                        <span v-if="bed.device_id && !bed.checked"
+                                                              style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>
+                                                        <span v-else>{{ bed.full_name }}</span>
+                                                    </el-checkbox>
+                                                    <!--                                        <div v-if="roleId === 8">-->
+                                                    <!--                                            <svg-icon icon-class="bed" style="color: #9aaabf;margin-right: 5px" />-->
+                                                    <!--                                            <span v-if="bed.device_id && !bed.checked" style="color: #13ce66">{{ bed.full_name }} {{ bed.clerk_name }}</span>-->
+                                                    <!--                                            <span v-else>{{ bed.full_name }}</span>-->
+                                                    <!--                                        </div>-->
+                                                </div>
+                                            </el-card>
+                                        </el-col>
+                                    </el-row>
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+                    </el-tabs>
+                    <div class="margin-top-xs text-center padding-content">
+                        <el-row>
+                            <el-col :span="8"> <el-checkbox v-if="clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')" v-model="clerkManageFrameSource.bool_phone_acceptor">{{this.$t('clerkFrameManage.phoneAcceptorTipsLeft')}}{{clerkManageFrameSource.clerk_name}}{{this.$t('clerkFrameManage.phoneAcceptorTipsMid')}},{{clerkManageFrameSource.clerk_name}}{{this.$t('clerkFrameManage.phoneAcceptorTipsRight')}}</el-checkbox></el-col>
+                            <el-col :span="8"> <el-button type="primary" :disabled="!clerkManageFrame.permissions.some(k=>k==='MANAGE_BED')" @click="saveClerkManageFrame">{{this.$t('action.saveSettings')}}</el-button></el-col>
+                            <el-col :span="8"></el-col>
+                        </el-row>
+
+                    </div>
+
+                </el-tab-pane>
+            </el-tabs>
+
+        </el-main>
+    </el-container>
+
+</template>
+
+<script>
+    import * as API_Clerk from '@/api/ncs_clerk'
+
+    const uiVersion = domain.uiVersion
+    const groupBy = (arr, func) =>
+        arr.map(typeof func === 'function' ? func : val => val[func]).reduce((acc, val, i) => {
+            acc[val] = (acc[val] || []).concat(arr[i])
+            return acc
+        }, {})
+    export default {
+        name: "employeeView",
+        computed: {
+            asideHeight() {
+                return this.mainAreaHeight - 80
+            }
+        },
+        data() {
+            return {
+                clerks: {},
+                activeName: 'first',
+                testdata: [{key: 1, check: false},
+                    {key: 2, check: false},
+                    {key: 3, check: false},
+                    {key: 4, check: false}
+                ],
+                showdata: [],
+                clerkManageFrame: {
+                    permissions:[]
+                },
+                clerkManageFrameSource: {},
+                managedRoomGroup: [],
+                noManagedRoomGroup: [],
+                uiVersion: uiVersion,
+                activeName1: 'allNoManange',
+                activeName2: 'allManaged',
+                currentClerk:{}
+            }
+        },
+        mounted() {
+            this.getRoleGroupClerk()
+            this.showdata = this.testdata
+        },
+        methods: {
+            getRoleGroupClerk() {
+                API_Clerk.getRoleGroupClerk(this.$store.getters.partId).then(res => {
+                    this.clerks = {...res}
+                    this.currentClerk = {...this.clerks[Object.keys(this.clerks)[0]][0]}
+                    this.getClerkManageFrame(this.currentClerk.clerk_id, 4)
+                })
+            },
+            handleOpen() {
+
+            },
+            handleClose() {
+
+            },
+            handleSelect(val){
+                let path =val.split('-').map(p=>Number(p))
+                this.currentClerk = {...this.clerks[Object.keys(this.clerks)[path[0]]][path[1]]}
+                this.getClerkManageFrame(this.currentClerk.clerk_id, 4)
+            },
+
+            getClerkManageFrame(clerkId, rootType) {
+
+                API_Clerk.getClerkManageFrame(clerkId, rootType).then(res => {
+                    this.clerkManageFrameSource = {...res}
+                    this.clerkManageFrame = {...this.clerkManageFrameSource}
+                    this.clerkManageFrame.managed_frames.forEach(item=>{
+                        this.countAllFrame(item)
+                    })
+
+                    this.clerkManageFrame.no_manage_frames.forEach(item=>{
+                        this.countAllFrame(item)
+                    })
+
+                    const managedGroup = groupBy(this.clerkManageFrame.managed_frames, item => item.group_name)
+                    this.managedRoomGroup = Object.entries(managedGroup)
+                    const noManagedGroup = groupBy(this.clerkManageFrame.no_manage_frames, item => item.group_name)
+                    this.noManagedRoomGroup = Object.entries(noManagedGroup)
+                })
+            },
+            handleCheckAll(checked, item) {
+                this.$set(item, 'indeterminate', false)
+                this.setFrameCheck(item, checked)
+            },
+            /** 设置选择状态 */
+            setFrameCheck(item, checked) {
+                const perm = this.MixinClone(item)
+                if (!Array.isArray(perm)) {
+                    this.$set(item, 'checked', checked)
+                    if (item.children && item.children.length) {
+                        this.$set(item, 'children', this.setFrameCheck(item.children, checked))
+                    }
+                } else {
+                    perm.map(item => {
+                        item.checked = checked
+                        this.$set(item, 'checked', checked)
+                        if (item.children && item.children.length) {
+                            this.$set(item, 'children', this.setFrameCheck(item.children, checked))
+                        }
+                    })
+                }
+                return perm
+            },
+            /** 选择 */
+            handleCheckboxChanged(item) {
+                this.countAllFrame(item)
+            },
+            /** 获取所有frame的长度、被选中的长度 */
+            countAllFrame(frame) {
+                const _list = []
+                if (!Array.isArray(frame)) {
+                    // _list.push(frame)
+                    if (frame.children) _list.push(...this.countAllFrame(frame.children))
+                } else {
+                    frame.forEach(item => {
+                         _list.push(item)
+                        if (item.children) _list.push(...this.countAllFrame(item.children))
+                    })
+                }
+                const length = _list.length
+                const length_checked = _list.filter(_item => _item.checked).length
+                this.$set(frame, 'allCkeck', length === _list.filter(_item => _item.checked).length)
+                this.$set(frame, 'indeterminate', (length_checked !== 0) && (length !== length_checked))
+                return _list
+            },
+            handlerSearchManaged(keywords,view) {
+                if (keywords !== '') {
+                    if(view===1){
+                        this.clerkManageFrame.managed_frames =this.clerkManageFrameSource.managed_frames.filter(p => p.full_name.indexOf(keywords) > -1 || p.chidren !== null && p.children.length > 0 && p.children.some(k => k.full_name.indexOf(keywords) > -1))
+                    }else{
+                        this.clerkManageFrame.no_manage_frames = this.clerkManageFrameSource.no_manage_frames.filter(p => p.full_name.indexOf(keywords) > -1 || p.chidren !== null && p.children.length > 0 && p.children.some(k => k.full_name.indexOf(keywords) > -1))
+                    }
+                } else {
+                    if(view===1){
+                        this.clerkManageFrame.managed_frames = [...this.clerkManageFrameSource.managed_frames]
+                    }else{
+                        this.clerkManageFrame.no_manage_frames = [...this.clerkManageFrameSource.no_manage_frames]
+                    }
+
+
+                }
+                const managedGroup = groupBy(this.clerkManageFrame.managed_frames, item => item.group_name)
+                this.managedRoomGroup = Object.entries(managedGroup)
+                const noManagedGroup = groupBy(this.clerkManageFrame.no_manage_frames, item => item.group_name)
+                this.noManagedRoomGroup = Object.entries(noManagedGroup)
+
+            },
+            saveClerkManageFrame() {
+                API_Clerk.saveClerkManageFrame(this.clerkManageFrameSource).then(res => {
+                    this.getClerkManageFrame(this.currentClerk.clerk_id, 4)
+                    this.$message.success(this.$t('action.saveSuccess'))
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+    .el-aside {
+        margin: 8px;
+        padding: 8px;
+        /*border-width: 1px;*/
+        /*border-style: solid;*/
+        background: #fff;
+    }
+
+    .el-submenu .el-menu-item {
+        width: 100% !important;
+    }
+
+    .custom-tree-node {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-size: 14px;
+        padding-right: 8px;
+    }
+
+    .el-tree {
+        margin-top: 8px
+    }
+
+    /deep/ .el-main {
+        margin: 8px;
+        padding: 0;
+        overflow: hidden;
+    }
+
+    /deep/ .scrollbar-wrapper {
+        height: 100%;
+        overflow-x: hidden;
+    }
+
+    /deep/ .inner-tab-panel .el-tabs__content {
+        /*height:calc(100vh - 260px)*/
+    }
+
+    /deep/ .el-menu-item-group__title {
+        display: none;
+    }
+
+    .el-scrollbar {
+        height: 100%;
+    }
+
+    /deep/ .svg-icon {
+        margin-right: 16px;
+    }
+
+    /deep/ .el-tabs--border-card > .el-tabs__content {
+        padding: 15px;
+        padding-right: 0;
+    }
+
+    .el-row--flex {
+        flex-wrap: wrap !important;
+        margin-top: 20px;
+    }
+
+    .el-col {
+        margin-bottom: 20px !important;
+    }
+
+    /deep/.el-checkbox__input.is-disabled.is-checked + span.el-checkbox__label{
+        color: #1890ff;
+    }
+ /deep/ .el-checkbox__label{
+     white-space: normal;
+     text-align: left;
+ }
+</style>

src/views/ncs-clerk-frame-manage/components/frameView.vue

@@ -0,0 +1,500 @@
+<template>
+
+    <el-container :style="{height: asideHeight+'px'}">
+        <el-aside width="280px" style="border-color: rgb(238, 241, 246)">
+            <div class="el-row--flex">
+                <el-input
+                        v-model="filterText"
+                        :placeholder="this.$t('frameManage.keywordsFilter')"
+                        clearable
+                />
+            </div>
+            <el-tree
+                    ref="frameTree"
+                    :data="treeData"
+                    :show-checkbox="false"
+                    node-key="id"
+                    :default-expand-all="true"
+                    :auto-expand-parent="true"
+                    :expand-on-click-node="false"
+                    :highlight-current="true"
+                    :current-node-key="selectedNodeId"
+                    :accordion="true"
+                    :filter-node-method="filterNode"
+                    @node-click="nodeClick"
+            >
+          <span slot-scope="{ node, data }" class="custom-tree-node">
+
+            <!--            <span><svg-icon :icon-class="data.type===4?'sickroom':data.type===5?'bed':'area'" />{{ data.full_name }}</span>-->
+              <span
+              ><svg-icon
+                      :style="data.customer_id ? 'color: #0a901c' : ''"
+                      :icon-class="data.type===4?'sickroom':data.type===5?'bed':'area'"
+              />{{ data.full_name }}</span>
+
+
+          </span>
+            </el-tree>
+        </el-aside>
+        <el-main>
+
+            <el-card :style="{height: asideHeight -20 +'px'}">
+                <el-form>
+                    <el-tabs v-model="activeName">
+                        <el-tab-pane :label="this.$t('clerkFrameManage.settableEmployee')" name="first">
+
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-160)+'px'}">
+                                <div style="padding: 0 15px">
+
+
+                                    <el-row v-if="frameManagedClerk.settable!==undefined && Object.keys(frameManagedClerk.settable).length>0">
+                                        <el-col :span="24">
+
+                                            <div class="text item">
+
+                                                <fieldset style="margin-bottom: 10px"
+                                                          v-for="(roleName,_index) in Object.keys(frameManagedClerk.settable)"
+                                                          :key="_index">
+                                                    <legend><span
+                                                            style="margin-right: 10px">{{roleName}}</span>
+                                                    </legend>
+                                                    <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                        <el-col :span="24">
+                                                            <el-checkbox
+                                                                    v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                    @change="(val)=>{checkChange(val,roleName)}"
+                                                                    :key="index" v-model="clerk.checked"
+                                                            >{{ clerk.clerk_name }}
+                                                            </el-checkbox>
+                                                        </el-col>
+                                                    </el-row>
+                                                    <el-divider
+                                                            v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"></el-divider>
+                                                    <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                            v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)">
+                                                        <el-col :span="24">
+                                                            <el-form-item
+                                                                    :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                                <el-select
+                                                                        v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                        @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                        >
+                                                                    <el-option
+                                                                            v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                            v-if="clerk.checked"
+                                                                            :key="clerk.clerk_id"
+                                                                            :label="clerk.clerk_name"
+                                                                            :value="clerk.clerk_id">
+                                                                    </el-option>
+                                                                </el-select>
+                                                            </el-form-item>
+                                                        </el-col>
+                                                    </el-row>
+                                                </fieldset>
+                                            </div>
+
+
+                                        </el-col>
+                                    </el-row>
+
+
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+                        <el-tab-pane :label="this.$t('clerkFrameManage.settedEmployee')" name="second">
+
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-160)+'px'}">
+                                <div style="padding: 0 15px">
+
+
+                                    <el-row v-if="frameManagedClerk.settable!==undefined && Object.keys(frameManagedClerk.settable).length>0">
+                                        <el-col :span="24">
+
+                                            <div class="text item">
+
+                                                <fieldset style="margin-bottom: 10px"
+                                                          v-for="(roleName,_index) in Object.keys(frameManagedClerk.settable)"
+                                                          v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"
+                                                          :key="_index">
+                                                    <legend><span
+                                                            style="margin-right: 10px">{{roleName}}</span>
+                                                    </legend>
+                                                    <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                        <el-col :span="24">
+                                                            <el-checkbox
+                                                                    v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                    v-if="clerk.checked"
+                                                                    @change="(val)=>{checkChange(val,roleName)}"
+                                                                    :key="index" v-model="clerk.checked">{{
+                                                                clerk.clerk_name }}
+                                                            </el-checkbox>
+                                                        </el-col>
+                                                    </el-row>
+                                                    <el-divider
+                                                            v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"></el-divider>
+                                                    <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                            v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)">
+                                                        <el-col :span="24">
+                                                            <el-form-item
+                                                                    :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                                <el-select
+                                                                        v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                        @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                       >
+                                                                    <el-option
+                                                                            v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                            v-if="clerk.checked"
+                                                                            :key="clerk.clerk_id"
+                                                                            :label="clerk.clerk_name"
+                                                                            :value="clerk.clerk_id">
+                                                                    </el-option>
+                                                                </el-select>
+                                                            </el-form-item>
+                                                        </el-col>
+                                                    </el-row>
+                                                </fieldset>
+                                            </div>
+
+
+                                        </el-col>
+                                    </el-row>
+
+
+                                    <el-row class="margin-top-sm"
+                                            v-if="frameManagedClerk.un_settable!==undefined && Object.keys(frameManagedClerk.un_settable).length>0">
+                                        <el-col :span="24">
+
+                                            <div class="text item">
+
+                                                <fieldset style="margin-bottom: 10px"
+                                                          v-for="(roleName,_index) in Object.keys(frameManagedClerk.un_settable)"
+                                                          :key="_index"
+                                                          v-if="frameManagedClerk.un_settable[roleName].length>0&&frameManagedClerk.un_settable[roleName].some(p=>p.checked)">
+                                                    <legend><span
+                                                            style="margin-right: 10px">{{roleName}}</span>
+                                                    </legend>
+                                                    <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                        <el-col :span="24">
+                                                            <el-checkbox
+                                                                    v-for="(clerk,index) in frameManagedClerk.un_settable[roleName]"
+                                                                    v-if="clerk.checked" disabled :key="index"
+                                                                    v-model="clerk.checked"
+                                                            >{{ clerk.clerk_name }}
+                                                            </el-checkbox>
+                                                        </el-col>
+                                                    </el-row>
+                                                </fieldset>
+                                            </div>
+
+
+                                        </el-col>
+                                    </el-row>
+
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+
+                        <el-tab-pane :label="this.$t('clerkFrameManage.allEmployee')" name="third">
+                            <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-160)+'px'}">
+                                <div style="padding: 0 15px">
+
+
+                                    <el-row v-if="frameManagedClerk.settable!==undefined && Object.keys(frameManagedClerk.settable).length>0">
+                                        <el-col :span="24">
+
+                                            <div class="text item">
+
+                                                <fieldset style="margin-bottom: 10px"
+                                                          v-for="(roleName,_index) in Object.keys(frameManagedClerk.settable)"
+                                                          :key="_index">
+                                                    <legend><span
+                                                            style="margin-right: 10px">{{roleName}}</span>
+                                                    </legend>
+                                                    <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                        <el-col :span="24">
+                                                            <el-checkbox
+                                                                    v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                    :key="index" v-model="clerk.checked"
+                                                                    @change="(val)=>{checkChange(val,roleName)}"
+                                                            >{{ clerk.clerk_name }}
+                                                            </el-checkbox>
+                                                        </el-col>
+                                                    </el-row>
+                                                    <el-divider
+                                                            v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"></el-divider>
+                                                    <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                            v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)">
+                                                        <el-col :span="24">
+                                                            <el-form-item
+                                                                    :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                                <el-select
+                                                                        v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                        @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                       >
+                                                                    <el-option
+                                                                            v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                            v-if="clerk.checked"
+                                                                            :key="clerk.clerk_id"
+                                                                            :label="clerk.clerk_name"
+                                                                            :value="clerk.clerk_id">
+                                                                    </el-option>
+                                                                </el-select>
+                                                            </el-form-item>
+                                                        </el-col>
+                                                    </el-row>
+                                                </fieldset>
+                                            </div>
+
+
+                                        </el-col>
+                                    </el-row>
+
+
+                                    <el-row class="margin-top-sm"
+                                            v-if="frameManagedClerk.un_settable!==undefined && Object.keys(frameManagedClerk.un_settable).length>0">
+                                        <el-col :span="24">
+
+                                            <div class="text item">
+
+                                                <fieldset style="margin-bottom: 10px"
+                                                          v-for="(roleName,_index) in Object.keys(frameManagedClerk.un_settable)"
+                                                          :key="_index">
+                                                    <legend><span
+                                                            style="margin-right: 10px">{{roleName}}</span>
+                                                    </legend>
+                                                    <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                        <el-col :span="24">
+                                                            <el-checkbox
+                                                                    v-for="(clerk,index) in frameManagedClerk.un_settable[roleName]"
+                                                                    disabled :key="index" v-model="clerk.checked"
+                                                            >{{ clerk.clerk_name }}
+                                                            </el-checkbox>
+                                                        </el-col>
+                                                    </el-row>
+                                                    <el-divider
+                                                            v-if="frameManagedClerk.un_settable[roleName].length>0&&frameManagedClerk.un_settable[roleName].some(p=>p.checked)"></el-divider>
+                                                    <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                            v-if="frameManagedClerk.un_settable[roleName].length>0&&frameManagedClerk.un_settable[roleName].some(p=>p.checked)">
+                                                        <el-col :span="24">
+                                                            <el-form-item
+                                                                    :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                                <el-select
+                                                                        v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                        @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                        disabled>
+                                                                    <el-option
+                                                                            v-for="(clerk,index) in frameManagedClerk.un_settable[roleName]"
+                                                                            v-if="clerk.checked"
+                                                                            :key="clerk.clerk_id"
+                                                                            :label="clerk.clerk_name"
+                                                                            :value="clerk.clerk_id">
+                                                                    </el-option>
+                                                                </el-select>
+                                                            </el-form-item>
+                                                        </el-col>
+                                                    </el-row>
+                                                </fieldset>
+                                            </div>
+
+
+                                        </el-col>
+                                    </el-row>
+
+                                </div>
+                            </el-scrollbar>
+                        </el-tab-pane>
+                    </el-tabs>
+
+                </el-form>
+                <div class="margin-top-xs text-center padding-content">
+                    <el-button type="primary" :disabled="frameManagedClerk['type']!==5" @click="saveFrameManagedClerk">
+                        {{this.$t('action.saveSettings')}}
+                    </el-button>
+                </div>
+            </el-card>
+
+        </el-main>
+    </el-container>
+</template>
+
+<script>
+    import * as API_FrameGroup from '@/api/ncs_frameGroup'
+    import {FRAME_TYPE} from '@/utils/enum/FrameTypeEnum'
+    import i18n from "../../../utils/i18n"
+
+    export default {
+        name: "frameView",
+        computed: {
+            asideHeight() {
+                return this.mainAreaHeight - 80
+            }
+        },
+        watch: {
+            selectedNodeId(newval, old) {
+                // this.selectedNode = this.findNodeById(this.treeData, newval)
+            },
+            filterText(val) {
+                this.$refs.frameTree.filter(val)
+            }
+        },
+        mounted() {
+            this.getFrameTree().then(() => {
+                this.selectedNodeId = this.treeData[0].id
+                this.$refs.frameTree.setCurrentKey(this.selectedNodeId)
+            }).catch(err => {
+                this.$message.error(err.message)
+            })
+        },
+        data() {
+            return {
+                treeData: [],
+                treeDataClone: [],
+                isShowTooltip: false,
+                /** 当前选中的树节点 */
+                selectedNodeId: 0,
+                selectedNode: {},
+                filterText: '',
+                abc: [],
+                frameManagedClerk: {},
+                activeName: 'first',
+                i18n:i18n
+            }
+        },
+        methods: {
+            /**
+             * 获取空间结构树形数据
+             * */
+            getFrameTree() {
+                return new Promise((resolve, reject) => {
+                    API_FrameGroup.getframestruct(this.$store.getters.partId, FRAME_TYPE.PART).then(res => {
+                        this.treeData = res.frameTree
+                        resolve()
+                    }).catch(err => {
+                        reject(err)
+                    })
+                })
+            },
+            checkChange(val, roleName) {
+
+                const roleCheckedClerk = this.frameManagedClerk.settable[roleName].filter(p => p.checked)
+
+                if (roleCheckedClerk.length === 0) {
+                    this.frameManagedClerk.phone_acceptor[roleName]=null
+                    this.frameManagedClerk.settable[roleName].forEach(item => {
+                        item.bool_phone_acceptor = false
+                    })
+                } else if (roleCheckedClerk.length === 1) {  //角色群组中只选中了一个职员，把该职员设为默认的电话接收人
+                    this.frameManagedClerk.phone_acceptor[roleName] = roleCheckedClerk[0].clerk_id
+                    this.frameManagedClerk.settable[roleName].forEach(item => {
+                        if (item.clerk_id === roleCheckedClerk[0].clerk_id) {
+                            item.bool_phone_acceptor = true
+                        } else {
+                            item.bool_phone_acceptor = false
+                        }
+                    })
+                } else if (roleCheckedClerk.length > 1) {//查看当前电话接收人是否是选中状态，如果不是选中状态，修改电话接收人
+                    const currentPhoneAcceptor = this.frameManagedClerk.settable[roleName].filter(p => p.clerk_id === this.frameManagedClerk.phone_acceptor[roleName])[0]
+                    if (currentPhoneAcceptor !== undefined && !currentPhoneAcceptor.checked) {
+                        this.frameManagedClerk.phone_acceptor[roleName] = roleCheckedClerk[0].clerk_id
+                        this.frameManagedClerk.settable[roleName].forEach(item => {
+                            if (item.clerk_id === roleCheckedClerk[0].clerk_id) {
+                                item.bool_phone_acceptor = true
+                            } else {
+                                item.bool_phone_acceptor = false
+                            }
+                        })
+                    }
+
+                }
+            },
+            phoneAcceptorChange(val, roleName) {
+                const phoneAcceptor = this.frameManagedClerk.phone_acceptor[roleName]
+                this.frameManagedClerk.settable[roleName].forEach(item => {
+                    if (item.clerk_id === phoneAcceptor) {
+                        item.bool_phone_acceptor = true
+                    } else {
+                        item.bool_phone_acceptor = false
+                    }
+                })
+            },
+            getFrameManagedClerk(frameId) {
+                API_FrameGroup.getFrameManagedClerk(frameId).then(res => {
+                    this.frameManagedClerk = {...res}
+                }).catch(err => {
+
+                })
+            },
+
+
+            /** 节点过滤方法 **/
+            filterNode(value, data) {
+                if (!value) return true
+                return data.full_name.indexOf(value) !== -1
+            },
+            /** 点击树形节点  **/
+            nodeClick(data, node, leaf) {
+                this.$set(this, 'selectedNodeId', data.id)
+                this.getFrameManagedClerk(data.id)
+            },
+
+            saveFrameManagedClerk() {
+                API_FrameGroup.saveFrameManagedClerk(this.frameManagedClerk).then(res => {
+
+                    this.getFrameManagedClerk(res.id)
+                    this.$message.success(this.$t('action.saveSuccess'))
+                }).catch(err => {
+                    this.$message.error(err.message)
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .el-aside {
+        margin: 8px;
+        padding: 8px;
+        border-width: 1px;
+        border-style: solid;
+        background: #fff;
+    }
+
+    .custom-tree-node {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-size: 14px;
+        padding-right: 8px;
+    }
+
+    .el-tree {
+        margin-top: 8px
+    }
+
+    .el-main {
+        margin: 8px;
+        padding: 0;
+    }
+
+    fieldset {
+        border: 1px solid #DCDFE6;
+        border-radius: 5px;
+    }
+
+    .margin-top-sm {
+        margin-top: 10px
+    }
+
+    /deep/ .el-checkbox__input.is-disabled.is-checked + span.el-checkbox__label {
+        color: #1890ff;
+    }
+
+    /deep/ .el-scrollbar__wrap {
+        overflow-x: hidden;
+    }
+
+    /deep/ .el-form-item {
+        margin-bottom: 10px;
+    }
+</style>

src/views/ncs-clerk-frame-manage/components/multiClerkManageFrame.vue

@@ -0,0 +1,500 @@
+<template>
+    <el-container :style="{height: asideHeight+'px'}">
+        <el-aside width="280px" style="border-color: rgb(238, 241, 246)">
+            <div class="el-row--flex">
+                <el-input
+                        v-model="filterText"
+                        :placeholder="this.$t('frameManage.keywordsFilter')"
+                        clearable
+                />
+            </div>
+            <el-tree
+                    ref="frameTree"
+                    :data="treeData"
+                    :show-checkbox="false"
+                    node-key="id"
+                    :default-expand-all="true"
+                    :auto-expand-parent="true"
+                    :expand-on-click-node="false"
+                    :highlight-current="true"
+                    :current-node-key="selectedNodeId"
+                    :accordion="true"
+                    :filter-node-method="filterNode"
+                    @node-click="nodeClick"
+            >
+          <span slot-scope="{ node, data }" class="custom-tree-node">
+
+            <!--            <span><svg-icon :icon-class="data.type===4?'sickroom':data.type===5?'bed':'area'" />{{ data.full_name }}</span>-->
+              <span
+              ><svg-icon
+                      :style="data.customer_id ? 'color: #0a901c' : ''"
+                      :icon-class="data.type===4?'sickroom':data.type===5?'bed':'area'"
+              />{{ data.full_name }}</span>
+
+
+          </span>
+            </el-tree>
+        </el-aside>
+        <el-main>
+
+            <el-card :style="{height: asideHeight -20 +'px'}">
+                <el-form>
+                <el-tabs v-model="activeName" >
+                    <el-tab-pane :label="this.$t('clerkFrameManage.settableEmployee')" name="first">
+
+                        <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-160)+'px'}">
+                            <div style="padding: 0 15px">
+
+
+                                <el-row v-if="frameManagedClerk.settable!==undefined && Object.keys(frameManagedClerk.settable).length>0">
+                                    <el-col :span="24">
+
+                                        <div class="text item">
+
+                                            <fieldset style="margin-bottom: 10px"  v-for="(roleName,_index) in Object.keys(frameManagedClerk.settable)"  :key="_index">
+                                                <legend><span
+                                                        style="margin-right: 10px">{{roleName}}</span>
+                                                </legend>
+                                                <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                    <el-col :span="24">
+                                                        <el-checkbox v-for="(clerk,index) in frameManagedClerk.settable[roleName]"  :key="index" v-model="clerk.checked"
+                                                                     @change="(val)=>{checkChange(val,roleName)}"
+                                                        >{{ clerk.clerk_name }}
+                                                        </el-checkbox>
+                                                    </el-col>
+                                                </el-row>
+                                                <el-divider
+                                                        v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"></el-divider>
+                                                <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                        v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)">
+                                                    <el-col :span="24">
+                                                        <el-form-item
+                                                                :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                            <el-select
+                                                                    v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                    @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                    >
+                                                                <el-option
+                                                                        v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                        v-if="clerk.checked"
+                                                                        :key="clerk.clerk_id"
+                                                                        :label="clerk.clerk_name"
+                                                                        :value="clerk.clerk_id">
+                                                                </el-option>
+                                                            </el-select>
+                                                        </el-form-item>
+                                                    </el-col>
+                                                </el-row>
+                                            </fieldset>
+                                        </div>
+
+
+                                    </el-col>
+                                </el-row>
+
+
+
+
+                            </div>
+                        </el-scrollbar>
+                    </el-tab-pane>
+                    <el-tab-pane :label="this.$t('clerkFrameManage.settedEmployee')" name="second">
+
+                        <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-160)+'px'}">
+                            <div style="padding: 0 15px">
+
+
+                                <el-row v-if="frameManagedClerk.settable!==undefined && Object.keys(frameManagedClerk.settable).length>0">
+                                    <el-col :span="24">
+
+                                        <div class="text item">
+
+                                            <fieldset style="margin-bottom: 10px"  v-for="(roleName,_index) in Object.keys(frameManagedClerk.settable)" v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)" :key="_index">
+                                                <legend><span
+                                                        style="margin-right: 10px">{{roleName}}</span>
+                                                </legend>
+                                                <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                    <el-col :span="24">
+                                                        <el-checkbox v-for="(clerk,index) in frameManagedClerk.settable[roleName]" v-if="clerk.checked" :key="index" v-model="clerk.checked"
+                                                                     @change="(val)=>{checkChange(val,roleName)}"
+                                                        >{{ clerk.clerk_name }}
+                                                        </el-checkbox>
+                                                    </el-col>
+                                                </el-row>
+                                                <el-divider
+                                                        v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"></el-divider>
+                                                <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                        v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)">
+                                                    <el-col :span="24">
+                                                        <el-form-item
+                                                                :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                            <el-select
+                                                                    v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                    @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                    >
+                                                                <el-option
+                                                                        v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                        v-if="clerk.checked"
+                                                                        :key="clerk.clerk_id"
+                                                                        :label="clerk.clerk_name"
+                                                                        :value="clerk.clerk_id">
+                                                                </el-option>
+                                                            </el-select>
+                                                        </el-form-item>
+                                                    </el-col>
+                                                </el-row>
+                                            </fieldset>
+                                        </div>
+
+
+                                    </el-col>
+                                </el-row>
+
+
+                                <el-row class="margin-top-sm" v-if="frameManagedClerk.un_settable!==undefined && Object.keys(frameManagedClerk.un_settable).length>0" >
+                                    <el-col :span="24">
+
+                                        <div class="text item">
+
+                                            <fieldset style="margin-bottom: 10px"  v-for="(roleName,_index) in Object.keys(frameManagedClerk.un_settable)" :key="_index" v-if="frameManagedClerk.un_settable[roleName].length>0&&frameManagedClerk.un_settable[roleName].some(p=>p.checked)">
+                                                <legend><span
+                                                        style="margin-right: 10px">{{roleName}}</span>
+                                                </legend>
+                                                <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                    <el-col :span="24">
+                                                        <el-checkbox v-for="(clerk,index) in frameManagedClerk.un_settable[roleName]" v-if="clerk.checked" disabled :key="index" v-model="clerk.checked"
+                                                        >{{ clerk.clerk_name }}
+                                                        </el-checkbox>
+                                                    </el-col>
+                                                </el-row>
+                                                <el-divider
+                                                        v-if="frameManagedClerk.un_settable[roleName].length>0&&frameManagedClerk.un_settable[roleName].some(p=>p.checked)"></el-divider>
+                                                <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                        v-if="frameManagedClerk.un_settable[roleName].length>0&&frameManagedClerk.un_settable[roleName].some(p=>p.checked)">
+                                                    <el-col :span="24">
+                                                        <el-form-item
+                                                                :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                            <el-select
+                                                                    v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                    @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                    disabled>
+                                                                <el-option
+                                                                        v-for="(clerk,index) in frameManagedClerk.un_settable[roleName]"
+                                                                        v-if="clerk.checked"
+                                                                        :key="clerk.clerk_id"
+                                                                        :label="clerk.clerk_name"
+                                                                        :value="clerk.clerk_id">
+                                                                </el-option>
+                                                            </el-select>
+                                                        </el-form-item>
+                                                    </el-col>
+                                                </el-row>
+                                            </fieldset>
+                                        </div>
+
+
+                                    </el-col>
+                                </el-row>
+
+                            </div>
+                        </el-scrollbar>
+                    </el-tab-pane>
+
+                    <el-tab-pane :label="this.$t('clerkFrameManage.allEmployee')" name="third">
+                        <el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: (asideHeight-160)+'px'}">
+                            <div style="padding: 0 15px">
+
+
+                                <el-row v-if="frameManagedClerk.settable!==undefined && Object.keys(frameManagedClerk.settable).length>0">
+                                    <el-col :span="24">
+
+                                        <div class="text item">
+
+                                            <fieldset style="margin-bottom: 10px"  v-for="(roleName,_index) in Object.keys(frameManagedClerk.settable)" :key="_index">
+                                                <legend><span
+                                                        style="margin-right: 10px">{{roleName}}</span>
+                                                </legend>
+                                                <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                    <el-col :span="24">
+                                                        <el-checkbox v-for="(clerk,index) in frameManagedClerk.settable[roleName]" :key="index" v-model="clerk.checked"
+                                                                     @change="(val)=>{checkChange(val,roleName)}"
+                                                        >{{ clerk.clerk_name }}
+                                                        </el-checkbox>
+                                                    </el-col>
+                                                </el-row>
+                                                <el-divider
+                                                        v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)"></el-divider>
+                                                <el-row type="flex" :gutter="20" class="margin-top-sm"
+                                                        v-if="frameManagedClerk.settable[roleName].length>0&&frameManagedClerk.settable[roleName].some(p=>p.checked)">
+                                                    <el-col :span="24">
+                                                        <el-form-item
+                                                                :label="i18n.t('clerkFrameManage.phoneAcceptorLabel')">
+                                                            <el-select
+                                                                    v-model="frameManagedClerk.phone_acceptor[roleName]"
+                                                                    @change="(val)=>{phoneAcceptorChange(val,roleName)}"
+                                                                    >
+                                                                <el-option
+                                                                        v-for="(clerk,index) in frameManagedClerk.settable[roleName]"
+                                                                        v-if="clerk.checked"
+                                                                        :key="clerk.clerk_id"
+                                                                        :label="clerk.clerk_name"
+                                                                        :value="clerk.clerk_id">
+                                                                </el-option>
+                                                            </el-select>
+                                                        </el-form-item>
+                                                    </el-col>
+                                                </el-row>
+                                            </fieldset>
+                                        </div>
+
+
+                                    </el-col>
+                                </el-row>
+
+
+                                <el-row class="margin-top-sm" v-if="frameManagedClerk.un_settable!==undefined && Object.keys(frameManagedClerk.un_settable).length>0">
+                                    <el-col :span="24">
+
+                                        <div class="text item">
+
+                                            <fieldset style="margin-bottom: 10px"  v-for="(roleName,_index) in Object.keys(frameManagedClerk.un_settable)" :key="_index">
+                                                <legend><span
+                                                        style="margin-right: 10px">{{roleName}}</span>
+                                                </legend>
+                                                <el-row :gutter="20" type="flex" style="padding: 10px">
+                                                    <el-col :span="24">
+                                                        <el-checkbox v-for="(clerk,index) in frameManagedClerk.un_settable[roleName]" disabled :key="index" v-model="clerk.checked"
+                                                        >{{ clerk.clerk_name }}
+                                                        </el-checkbox>
+                                                    </el-col>
+                                                </el-row>
+                                            </fieldset>
+                                        </div>
+
+
+                                    </el-col>
+                                </el-row>
+
+                            </div>
+                        </el-scrollbar></el-tab-pane>
+                </el-tabs>
+
+
+                <div class="margin-top-xs text-center padding-content">
+                    <el-button type="primary"  :disabled="frameManagedClerk['type']===4" @click="saveFrameManagedClerk">{{this.$t('action.saveSettings')}}</el-button>
+                </div>
+                </el-form>
+            </el-card>
+
+        </el-main>
+    </el-container>
+</template>
+
+<script>
+    import * as API_FrameGroup from '@/api/ncs_frameGroup'
+    import {FRAME_TYPE} from '@/utils/enum/FrameTypeEnum'
+    import i18n from "../../../utils/i18n"
+    export default {
+        name: "multiClerkManageFrame",
+        computed: {
+            asideHeight() {
+                return this.mainAreaHeight - 80
+            }
+        },
+        watch: {
+            selectedNodeId(newval, old) {
+                // this.selectedNode = this.findNodeById(this.treeData, newval)
+            },
+            filterText(val) {
+                this.$refs.frameTree.filter(val)
+            }
+        },
+        mounted() {
+            this.getFrameTree().then(() => {
+                if(this.treeData[0]!=null){
+                    this.selectedNodeId = this.treeData[0].children[0].children[0].id
+                    this.$refs.frameTree.setCurrentKey(this.selectedNodeId)
+                    this.getFrameManagedClerk(this.selectedNodeId)
+                }else{
+                    this.frameManagedClerk={}
+                }
+            }).catch(err => {
+                this.$message.error(err.message)
+            })
+        },
+        data() {
+            return {
+                treeData: [],
+                treeDataClone: [],
+                isShowTooltip: false,
+                /** 当前选中的树节点 */
+                selectedNodeId: 0,
+                selectedNode: {},
+                filterText: '',
+                frameManagedClerk:{
+
+                },
+                activeName:'first',
+                i18n:i18n
+            }
+        },
+        methods: {
+            /**
+             * 获取空间结构树形数据
+             * */
+            getFrameTree() {
+                return new Promise((resolve, reject) => {
+                    API_FrameGroup.getframemultimanagedstruct(this.$store.getters.partId, FRAME_TYPE.PART).then(res => {
+                        this.treeData = [...res]
+                        resolve()
+                    }).catch(err => {
+                        reject(err)
+                    })
+                })
+            },
+
+            getFrameManagedClerk(frameId) {
+                API_FrameGroup.getFrameManagedClerk(frameId).then(res => {
+                    this.frameManagedClerk={...res}
+                }).catch(err => {
+
+                })
+            },
+            checkChange(val, roleName) {
+                const roleCheckedClerk = this.frameManagedClerk.settable[roleName].filter(p => p.checked)
+                if (roleCheckedClerk.length === 0) {
+                    this.frameManagedClerk.phone_acceptor[roleName]=null
+                    this.frameManagedClerk.settable[roleName].forEach(item => {
+                        item.bool_phone_acceptor = false
+                    })
+                } else if (roleCheckedClerk.length === 1) {  //角色群组中只选中了一个职员，把该职员设为默认的电话接收人
+                    this.frameManagedClerk.phone_acceptor[roleName] = roleCheckedClerk[0].clerk_id
+                    this.frameManagedClerk.settable[roleName].forEach(item => {
+                        if (item.clerk_id === roleCheckedClerk[0].clerk_id) {
+                            item.bool_phone_acceptor = true
+                        } else {
+                            item.bool_phone_acceptor = false
+                        }
+                    })
+                } else if (roleCheckedClerk.length > 1) {//查看当前电话接收人是否是选中状态，如果不是选中状态，修改电话接收人
+                    const currentPhoneAcceptor = this.frameManagedClerk.settable[roleName].filter(p => p.clerk_id === this.frameManagedClerk.phone_acceptor[roleName])[0]
+                    if (currentPhoneAcceptor !== undefined && !currentPhoneAcceptor.checked) {
+                        this.frameManagedClerk.phone_acceptor[roleName] = roleCheckedClerk[0].clerk_id
+                        this.frameManagedClerk.settable[roleName].forEach(item => {
+                            if (item.clerk_id === roleCheckedClerk[0].clerk_id) {
+                                item.bool_phone_acceptor = true
+                            } else {
+                                item.bool_phone_acceptor = false
+                            }
+                        })
+                    }
+
+                }
+            },
+            phoneAcceptorChange(val, roleName) {
+                const phoneAcceptor = this.frameManagedClerk.phone_acceptor[roleName]
+                this.frameManagedClerk.settable[roleName].forEach(item => {
+                    if (item.clerk_id === phoneAcceptor) {
+                        item.bool_phone_acceptor = true
+                    } else {
+                        item.bool_phone_acceptor = false
+                    }
+                })
+            },
+
+            /** 节点过滤方法 **/
+            filterNode(value, data) {
+                if (!value) return true
+                return data.full_name.indexOf(value) !== -1
+            },
+            /** 点击树形节点  **/
+            nodeClick(data, node, leaf) {
+                this.$set(this, 'selectedNodeId', data.id)
+                this.getFrameManagedClerk(data.id)
+            },
+
+            saveFrameManagedClerk(){
+                API_FrameGroup.saveFrameManagedClerk(this.frameManagedClerk).then(res=>{
+                    this.getFrameTree().then(() => {
+                        if(this.treeData[0]!=null){
+                            let node = this.findNodeById(this.treeData,this.selectedNodeId)
+                            if(node!=null){ //原来选选择的node没有了
+                            this.$refs.frameTree.setCurrentKey(this.selectedNodeId)
+                            }else{
+                                this.selectedNodeId = this.treeData[0].children[0].children[0].id
+                                this.$refs.frameTree.setCurrentKey(this.selectedNodeId)
+                            }
+                            this.getFrameManagedClerk(this.selectedNodeId)
+                        }else{
+                            this.frameManagedClerk={}
+                        }})
+                    this.$message.success(this.$t('action.saveSuccess'))
+                }).catch(err=>{
+                    this.$message.error(err.message)
+                })
+            },
+            /** 树形结构中查找指定Id节点 */
+            findNodeById(data, id) {
+                let node = null
+                if (data.length > 0) {
+                    for (var i = 0; i < data.length; i++) {
+                        if (data[i].id === id) {
+                            node = data[i]
+                            break
+                        }
+                        if (data[i].children && data[i].children.length > 0) {
+                            const subresult = this.findNodeById(data[i].children, id)
+                            if (subresult !== null) {
+                                node = subresult
+                                break
+                            }
+                        }
+                    }
+                }
+                return node
+            },
+        }
+    }
+
+</script>
+
+<style scoped>
+    .el-aside {
+        margin: 8px;
+        padding: 8px;
+        border-width: 1px;
+        border-style: solid;
+        background: #fff;
+    }
+
+    .custom-tree-node {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-size: 14px;
+        padding-right: 8px;
+    }
+
+    .el-tree {
+        margin-top: 8px
+    }
+
+    .el-main {
+        margin: 8px;
+        padding: 0;
+    }
+
+    fieldset {
+        border: 1px solid #DCDFE6;
+        border-radius: 5px;
+    }
+    .margin-top-sm{margin-top: 20px}
+    /deep/.el-checkbox__input.is-disabled.is-checked + span.el-checkbox__label{
+        color: #1890ff;
+    }
+    /deep/ .el-scrollbar__wrap{
+        overflow-x: hidden;
+    }
+
+</style>

src/views/ncs-clerk-frame-manage/index.vue

@@ -0,0 +1,49 @@
+<template>
+    <div class="container">
+        <el-container>
+            <el-header height="36px" align="center" style="padding: 10px">
+                        <el-radio-group v-model="radio1">
+                            <el-radio-button :label="1">{{this.$t('clerkFrameManage.employeeView')}}</el-radio-button>
+                            <el-radio-button :label="2">{{this.$t('clerkFrameManage.frameView')}}</el-radio-button>
+                            <el-radio-button :label="3">{{this.$t('clerkFrameManage.multiClerkView')}}</el-radio-button>
+                        </el-radio-group>
+
+            </el-header>
+            <el-divider></el-divider>
+            <el-main>
+                <employee-view v-if="radio1===1"></employee-view>
+                <frame-view v-if="radio1===2"></frame-view>
+                <multi-clerk-manage-frame v-if="radio1===3"></multi-clerk-manage-frame>
+            </el-main>
+        </el-container>
+    </div>
+</template>
+
+<script>
+    import EmployeeView from "./components/employeeView";
+    import FrameView from "./components/frameView";
+    import MultiClerkManageFrame from "./components/multiClerkManageFrame";
+
+    export default {
+        name: "index",
+        components: {MultiClerkManageFrame, FrameView, EmployeeView},
+        data() {
+            return {
+                radio1: 1
+            }
+        }
+
+    }
+</script>
+
+<style scoped>
+/deep/ .el-divider--horizontal{
+    margin:0;
+    margin-top: 20px;
+}
+
+/deep/ .el-main{
+    margin: 8px;
+    padding: 0;
+}
+</style>

src/views/ncs-clerk/components/clerkList.vue

@@ -147,26 +147,41 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row v-if="nurseList.length > 0">
+        <el-row v-if="addMemberForm.subordinate!==undefined && Object.keys(addMemberForm.subordinate).length>0">
           <el-col :span="24">
             <el-form-item :label="this.$t('clerkManage.clerkList')">
               <div class="text item">
-                <el-row>
-                  <el-checkbox-group v-model="newCheckList">
-                    <el-col v-for="(bed,_index) in nurseClerkList" :key="_index" :xs="8" :sm="8" :md="6" :lg="6" :xl="6">
-                      <el-checkbox :label="bed.clerk_id" @change="handleCheckboxChanged(bed)">
-                        <span v-if="bed.group_id && !bed.checked" style="color: #13ce66">{{ bed.clerk_name }}  <span style="color: #302db4">{{ bed.group_name }}</span></span>
-                        <span v-else>{{ bed.clerk_name }}</span>
+
+                <fieldset style="margin-bottom: 10px"  v-for="(roleName,_index) in Object.keys(addMemberForm.subordinate)" :key="_index">
+                  <legend><span
+                          style="margin-right: 10px">{{roleName}}</span>
+                  </legend>
+                  <el-row :gutter="20" type="flex" style="padding: 10px">
+                    <el-col :span="24">
+                      <el-checkbox v-for="(clerk,index) in addMemberForm.subordinate[roleName]" :key="index" v-model="clerk.checked"
+                                   >{{ clerk.clerk_name }}<span v-if="!clerk.checked&&clerk.leader_id!==addMemberForm.clerk_id" style="color: #67C23A;margin-left: 10px;">{{ clerk.leader_name }}</span>
                       </el-checkbox>
                     </el-col>
-                  </el-checkbox-group>
-                  <el-col v-for="(bed,_index) in nurseClerkList" :key="_index" :xs="8" :sm="8" :md="6" :lg="6" :xl="6">
-                    <!--                    <el-checkbox v-model="bed.checked">-->
-                    <!--                      <span v-if="bed.group_id && !bed.checked" style="color: #13ce66">{{ bed.clerk_name }}  <span style="color: #302db4">{{ bed.group_name }}</span></span>-->
-                    <!--                      <span v-else>{{ bed.clerk_name }}</span>-->
-                    <!--                    </el-checkbox>-->
-                  </el-col>
-                </el-row>
+                  </el-row>
+                </fieldset>
+
+
+<!--                <el-row>-->
+<!--                  <el-checkbox-group v-model="newCheckList">-->
+<!--                    <el-col v-for="(bed,_index) in addMemberForm.subordinate" :key="_index" :xs="8" :sm="8" :md="6" :lg="6" :xl="6">-->
+<!--                      <el-checkbox :label="bed.clerk_id" @change="handleCheckboxChanged(bed)">-->
+<!--                        <span v-if="bed.group_id && !bed.checked" style="color: #13ce66">{{ bed.clerk_name }}  <span style="color: #302db4">{{ bed.group_name }}</span></span>-->
+<!--                        <span v-else>{{ bed.clerk_name }}</span>-->
+<!--                      </el-checkbox>-->
+<!--                    </el-col>-->
+<!--                  </el-checkbox-group>-->
+<!--                  <el-col v-for="(bed,_index) in nurseClerkList" :key="_index" :xs="8" :sm="8" :md="6" :lg="6" :xl="6">-->
+<!--                    &lt;!&ndash;                    <el-checkbox v-model="bed.checked">&ndash;&gt;-->
+<!--                    &lt;!&ndash;                      <span v-if="bed.group_id && !bed.checked" style="color: #13ce66">{{ bed.clerk_name }}  <span style="color: #302db4">{{ bed.group_name }}</span></span>&ndash;&gt;-->
+<!--                    &lt;!&ndash;                      <span v-else>{{ bed.clerk_name }}</span>&ndash;&gt;-->
+<!--                    &lt;!&ndash;                    </el-checkbox>&ndash;&gt;-->
+<!--                  </el-col>-->
+<!--                </el-row>-->
               </div>
             </el-form-item>
 
@@ -204,13 +219,14 @@
 
 <script>
 // import { serverUrl } from '@/utils/domain'
-import * as clerk_API from '@/api/ncs_clerk'
+import * as API_Clerk from '@/api/ncs_clerk'
 import * as RegExp from '@/utils/RegExp'
 import { AG_GRID_LOCALE_CN } from '@/utils/AgGridVueLocaleCn'
 import ButtonCellRender from '@/components/AgGridCellRender/ButtonCellRender'
 import AgGridImg from '@/components/AgGridImg/AgGridImg'
 import ImageViewer from 'element-ui/packages/image/src/image-viewer'
 import RadioFilter from '@/components/AgGridCustomFilter/RadioFilter'
+import ListFilter from '@/components/AgGridCustomFilter/ListFilter'
 import * as API_User from "@/api/user";
 import {ROLE_TYPE} from "@/utils/enum/RoleTypeEnum";
 import ButtonCellRenderList from "@/components/AgGridCellRender/ButtonCellRenderList";
@@ -218,7 +234,8 @@ let prevOverflow = ''
 const serverUrl = domain.serverUrl
 export default {
   name: 'CareDoctorManager',
-  components: { ButtonCellRenderList, ButtonCellRender, AgGridImg, ImageViewer, RadioFilter },
+  components: { ButtonCellRenderList, ButtonCellRender, AgGridImg, ImageViewer, RadioFilter,ListFilter },
+
   props: {
     partId: {
       type: Number,
@@ -310,6 +327,7 @@ export default {
         { key: this.$t('member.man'), value: 1 },
         { key: this.$t('member.woman'), value: 0 }
       ],
+      roleTransfer:[],
       roleId: null,
       roleZzId: null,
       newCheckList: [],
@@ -331,7 +349,7 @@ export default {
       } else {
         this.shopId = val
       }
-      this.params.fixedCondition = this.part_view ? 'nc.shop_id=' + this.shopId : '1 = 1'
+      this.params.fixedCondition = this.part_view ? 'shop_id=' + this.shopId : '1 = 1'
       this.GET_MemberList()
     }
   },
@@ -345,11 +363,11 @@ export default {
         headerCheckboxSelectionFilteredOnly: true,
         checkboxSelection: true,
         sortable: false, filter: false,
-        width: 50,
+        width: 100,
         resizable: false,
         valueGetter: this.hashValueGetter
       },
-      { headerName: this.$t('member.face'), field: 'face', sortable: true, filter: false, width: 70,
+      { headerName: this.$t('member.face'), field: 'face', sortable: true, filter: false, width: 180,
         cellRendererFramework: 'AgGridImg',
         cellRendererParams: param => {
           return {
@@ -358,15 +376,19 @@ export default {
           }
         }
       },
-      { headerName: this.$t('member.uname'), field: 'uname', sortable: true, filter: true, minWidth: 170 },
-      { headerName: this.$t('member.nickname'), field: 'clerk_name', sortable: true, filter: true, minWidth: 120 },
-      { headerName: this.$t('member.sex'), field: 'sex', sortable: true, valueFormatter: this.formatterSex, width: 100, filterFramework: 'RadioFilter',
+      { headerName: this.$t('member.uname'), field: 'uname', sortable: true, filter: true, width: 180 },
+      { headerName: this.$t('member.nickname'), field: 'clerk_name', sortable: true, filter: true, width: 180 },
+      { headerName: this.$t('member.sex'), field: 'sex', sortable: true, valueFormatter: this.formatterSex, width: 180, filterFramework: 'RadioFilter',
         filterParams: {
           listData: this.sexTransfer
         }
       },
-      { headerName: this.$t('member.mobile'), field: 'mobile', sortable: true, filter: true, minWidth: 170 },
-      { headerName: this.$t('clerkManage.role'), field: 'role_name', sortable: true, filter: false, valueFormatter: this.formatterRole, width: 120 },
+      { headerName: this.$t('member.mobile'), field: 'mobile', sortable: true, filter: true, width: 200 },
+      { headerName: this.$t('clerkManage.role'), field: 'role_name', sortable: true, filter: false, valueFormatter: this.formatterRole,   filterFramework: 'ListFilter', flex:1,
+        filterParams: {
+          listData: this.roleTransfer
+        } },
+      { headerName: this.$t('member.leaderName'), field: 'leader_name', sortable: true, filter: true, width: 180 },
       { headerName: this.$t('action.handle'), field: 'id',
         cellRendererFramework: 'ButtonCellRender',
         cellRendererParams: param => {
@@ -380,7 +402,7 @@ export default {
         filter: false,
         pinned: 'right',
         lockPinned: true,
-        width: 100,
+        width: 160,
         resizable: false,
         sortable: false
       },
@@ -432,7 +454,7 @@ export default {
       // },
     ]
     this.defaultColDef = {
-      filter: 'agTextColumnFilter',
+      // filter: 'agTextColumnFilter',
       sortable: true,
       resizable: true,
       comparator: this.testComparator,
@@ -445,9 +467,11 @@ export default {
     }
     this.rowSelection = 'multiple'
   },
-  mounted() {
+  async mounted() {
     this.gridApi = this.gridOptions.api
-    this.getRoles({ page_size: 200, page_no: 1, fixedCondition: ' shop_id = -1', sort: ' role_id', dir: 'desc' })
+    this.gridApi = this.gridOptions.api
+    this.gridColumnApi = this.gridOptions.columnApi
+
     if (this.partId === 0) {
       this.shopId = this.$store.getters.partId
     } else {
@@ -455,6 +479,8 @@ export default {
     }
     this.params.fixedCondition = this.part_view ? 'shop_id=' + this.shopId : '1 = 1'
     this.GET_MemberList()
+    this.getRoles({ page_size: 200, page_no: 1, fixedCondition: ' shop_id = -1', sort: ' role_id', dir: 'desc' })
+
   },
   activated() {
     this.GET_MemberList()
@@ -468,8 +494,8 @@ export default {
     GET_MemberList() {
       this.loading = true
       this.gridApi.showLoadingOverlay()
-      this.gridApi.sizeColumnsToFit()
-      clerk_API.getList(this.params).then(response => {
+      // this.gridApi.sizeColumnsToFit()
+      API_Clerk.getList(this.params).then(response => {
         this.loading = false
         const size = 0
         // response.data.forEach((item, index) => {
@@ -504,7 +530,7 @@ export default {
         cancelButtonText: this.$t('action.cancel'),
         type: 'warning'
       }).then(() => {
-        clerk_API.remove(ids).then(
+        API_Clerk.remove(ids).then(
           response => {
             this.GET_MemberList()
             this.$message({
@@ -527,8 +553,14 @@ export default {
     },
     getRoles(param) {
       // 获取角色
-      clerk_API.getRoles(param).then(res => {
+      API_Clerk.getRoles(param).then(res => {
         this.rolesOptions = res.data
+        this.roleTransfer =[...res.data.map(p=>{return {'key':p.role_name,'value':p.role_name}})]
+        this.columnDefs[6].filterParams.listData=this.roleTransfer
+        console.log(this.columnDefs)
+        this.gridApi.setColumnDefs(this.columnDefs);
+        this.gridApi.redrawRows()
+        console.log(this.roleTransfer)
         const nurseZz = res.data.find(item => item.role_name === '护士组长')
         if (nurseZz) {
           this.roleZzId = nurseZz.role_id
@@ -594,24 +626,24 @@ export default {
           }
           params.role_name = this.rolesOptions.filter( p => p.role_id === params.role_id)[0].role_name
           if (params.member_id) {
-            if (this.roleZzId === params.role_id) {
-              const addIds = this.newCheckList.filter(function(val) { return _this.oldCheckList.indexOf(val) === -1 })
-              const delIds = this.oldCheckList.filter(function(val) { return _this.newCheckList.indexOf(val) === -1 })
-              const data = {
-                clerkId: params.clerk_id,
-                addIds: addIds.join(','),
-                delIds: delIds.join(',')
-              }
-              clerk_API.updateParentById(data)
-            }
-            clerk_API.update(params.clerk_id, params).then(response => {
+            // if (this.roleZzId === params.role_id) {
+            //   const addIds = this.newCheckList.filter(function(val) { return _this.oldCheckList.indexOf(val) === -1 })
+            //   const delIds = this.oldCheckList.filter(function(val) { return _this.newCheckList.indexOf(val) === -1 })
+            //   const data = {
+            //     clerkId: params.clerk_id,
+            //     addIds: addIds.join(','),
+            //     delIds: delIds.join(',')
+            //   }
+            //   API_Clerk.updateParentById(data)
+            // }
+            API_Clerk.update(params.clerk_id, params).then(response => {
               this.dialogAddMemberVisible = false
               this.imageUrl = null
               this.GET_MemberList()
             })
           } else {
             params.shop_id = this.shopId
-            clerk_API.add(params).then(response => {
+            API_Clerk.add(params).then(response => {
               this.dialogAddMemberVisible = false
               this.imageUrl = null
               this.GET_MemberList()
@@ -655,7 +687,7 @@ export default {
       const _this = this
       this.newCheckList = []
       this.oldCheckList = []
-      clerk_API.getNurseByRoleId(_this.roleId, this.shopId).then(r => {
+      API_Clerk.getNurseByRoleId(_this.roleId, this.shopId).then(r => {
         _this.nurseList = r
         _this.getNurseIds(id)
         // r.forEach(item => {
@@ -668,7 +700,7 @@ export default {
     },
     getNurseIds(id) {
       const _this = this
-      clerk_API.getNurseIdsByPartId(this.shopId).then(r => {
+      API_Clerk.getNurseIdsByPartId(this.shopId).then(r => {
         r.forEach(item => {
           _this.nurseList.forEach(t => {
             if (t.clerk_id === item.nurse_id) {
@@ -808,6 +840,11 @@ export default {
     cursor: pointer;
   }
 
+  fieldset {
+    border: 1px solid #DCDFE6;
+    border-radius: 5px;
+  }
+
   .formwrap /deep/ .el-tabs__content {
     overflow: visible !important;
   }

src/views/ncs-device/components/deviceManager.vue

@@ -777,7 +777,7 @@
                         if (this.onlineDevice.length > 0) {
                             if (this.isCannotBeOnline(item.device_type)) {
                                 if (item.eth_mac) {
-                                    const mac = this.onlineDevice.filter(p => p.toLowerCase() === item.eth_mac.toLowerCase())[0]
+                                    const mac = this.onlineDevice.filter(p => p != null && (p.toLowerCase() === item.eth_mac.toLowerCase()))[0]
                                     // console.log('在线设备1', mac)
                                     if (mac !== undefined && mac !== null) {
                                         item['online_state'] = this.$t('deviceManage.connectTrue')