更新页面
This commit is contained in:
@ -0,0 +1,5 @@
|
||||
<template>
|
||||
<div>list</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup></script>
|
||||
@ -0,0 +1,390 @@
|
||||
<template lang="pug">
|
||||
div(
|
||||
:class="{user_item: true, user_item_active, [`user_item_${props.index}`]: true}"
|
||||
@mouseenter="mouseEnterItem(props.index)"
|
||||
@mouseleave="mouseLeaveItem"
|
||||
)
|
||||
|
||||
.user_item_info
|
||||
tableColAvatar(:style='{width: "36px", height: "36px"}' :name="''" :record="props.userInfo")
|
||||
div.user_item_info_name
|
||||
.name {{ getName(props.userInfo) }}
|
||||
.type(v-if="getUserType") {{ getUserType }}
|
||||
|
||||
div(
|
||||
v-if="props.meetingType === 'noMeet' && userInfo.member_state === CONFERENCE_MEMBER_STATE_CALLING"
|
||||
style="color: rgba(12, 162, 255, 1);"
|
||||
) {{ $t('conference.control.calling') }}
|
||||
|
||||
div
|
||||
.user_item_opration(v-if="props.meetingType === 'meeting'")
|
||||
div.user_mask()
|
||||
div.icon_box
|
||||
WebPucSvgIcon(
|
||||
v-show="userInfo.microphone_status !== MICROPHONE_STATUS_NO"
|
||||
:name="isMicEnable ? 'microphone' : 'microphone_mute'")
|
||||
WebPucSvgIcon(
|
||||
v-show="userInfo.camera_status !== CAMERA_STATUS_NO"
|
||||
:name="userInfo.camera_status === CAMERA_STATUS_OPEN ? 'camera' : 'camera_mute'")
|
||||
|
||||
a-dropdown(
|
||||
v-if="globalStore.IS_CURRENT_MEETING_OWNER"
|
||||
@select="(val) => reliveSelect(val)"
|
||||
:popup-max-height="false"
|
||||
v-model:popup-visible="reliveVisible"
|
||||
position='br'
|
||||
trigger="hover"
|
||||
)
|
||||
a-button {{ $t('meeting.modal.release_text') }}
|
||||
icon-down
|
||||
template(#content)
|
||||
a-doption(
|
||||
v-for="item in getReliveList"
|
||||
:value="item.value"
|
||||
:key="item.value") {{ item.label }}
|
||||
|
||||
a-dropdown(
|
||||
@select="(val) => controlSelect(val)"
|
||||
:popup-max-height="false"
|
||||
v-model:popup-visible="controlVisible"
|
||||
trigger="hover"
|
||||
position='br')
|
||||
a-button {{ $t('meeting.modal.control_text') }}
|
||||
icon-down
|
||||
template(#content)
|
||||
a-doption(
|
||||
v-for="item in getControlList"
|
||||
:value="item.value"
|
||||
:disabled="item.disabled"
|
||||
:key="item.value") {{ item.label }}
|
||||
|
||||
.user_item_opration(v-if="props.meetingType === 'noMeet'")
|
||||
div.user_mask()
|
||||
a-dropdown(
|
||||
@select="(val) => controlSelect(val)"
|
||||
:popup-max-height="false"
|
||||
v-model:popup-visible="reliveVisible"
|
||||
position='br'
|
||||
trigger="hover"
|
||||
)
|
||||
a-button {{ $t('report.tab.call') }}
|
||||
icon-down
|
||||
template(#content)
|
||||
a-doption(
|
||||
v-for="item in getNoMeetOperate"
|
||||
:value="item.value"
|
||||
:key="item.value") {{ item.label }}
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import tableColAvatar from '@/views/webPuc/org/components/tableColAvatarByNumType.vue';
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { formatShowNameFin } from '@/components/Consultation/utils/format-show-name';
|
||||
import { $t } from '@/locale';
|
||||
import { useGlobalStore } from '@/store';
|
||||
import {
|
||||
MICROPHONE_STATUS_NO,
|
||||
MICROPHONE_STATUS_OPEN,
|
||||
MICROPHONE_STATUS_CLOSE,
|
||||
MUTE_STATUS_Y,
|
||||
MUTE_STATUS_N,
|
||||
CAMERA_STATUS_NO,
|
||||
CAMERA_STATUS_OPEN,
|
||||
CAMERA_STATUS_CLOSE,
|
||||
CONFERENCE_MEMBER_STATE_CALLING,
|
||||
PROHIBITION_STATUS_N,
|
||||
} from '@/components/Consultation/sdk/conferenceControl';
|
||||
|
||||
const globalStore = useGlobalStore();
|
||||
|
||||
const props = defineProps({
|
||||
meetingType: {
|
||||
type: String,
|
||||
default: 'meeting',
|
||||
},
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
index: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
currentIndex: {
|
||||
type: Number,
|
||||
default: -1,
|
||||
},
|
||||
isShowType: {
|
||||
// 是否显示人员类型
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// eslint-disable-next-line vue/prop-name-casing
|
||||
dispatcher_account: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
});
|
||||
|
||||
const reliveVisible = ref(false);
|
||||
const controlVisible = ref(false);
|
||||
|
||||
const isMicEnable = computed(() => {
|
||||
return (
|
||||
props.userInfo.prohibition_status === PROHIBITION_STATUS_N &&
|
||||
props.userInfo.mute_status === MUTE_STATUS_N
|
||||
);
|
||||
});
|
||||
|
||||
const emit = defineEmits([
|
||||
'changeCurrentIndex',
|
||||
'controlSelect',
|
||||
'reliveSelect',
|
||||
]);
|
||||
|
||||
// 获取资源名称\
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const getName = (record: Record<string, any>) => {
|
||||
const rolemap = {
|
||||
0: 'conference.role.common', // 参会者
|
||||
1: 'conference.role.host', // 主持人（仅用户或硬件终端）
|
||||
2: 'conference.role.creator', // 组织者（仅创建人）
|
||||
};
|
||||
|
||||
let type = '';
|
||||
|
||||
if (props.meetingType === 'meeting') {
|
||||
type = $t(rolemap[record.role]);
|
||||
}
|
||||
|
||||
return formatShowNameFin(record.nick || record.alias, type);
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const getUserType = computed(() => {
|
||||
let personType: any = '';
|
||||
if (props.userInfo.basedata_id === sessionStorage.getItem('basedata_id')) {
|
||||
personType = $t('meeting.modal.personType');
|
||||
} else {
|
||||
personType = false;
|
||||
}
|
||||
return personType;
|
||||
});
|
||||
|
||||
// 未入会成员-呼叫操作
|
||||
const getNoMeetOperate = computed(() => {
|
||||
return [
|
||||
{
|
||||
value: 'FullDuplexCall',
|
||||
label: $t('conference.fullDuplex_call'),
|
||||
},
|
||||
// {
|
||||
// value: 'HalfDuplexCall',
|
||||
// label: $t('conference.halfDuplex_call'),
|
||||
// },
|
||||
{
|
||||
value: 'AllCall',
|
||||
label: $t('conference.control.allCall'),
|
||||
},
|
||||
];
|
||||
});
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
// 已入会-解除操作
|
||||
const getReliveList = computed(() => {
|
||||
return [
|
||||
{
|
||||
value: 'ReleaseProhibition',
|
||||
label: $t('meeting.modal.release_voice_text'),
|
||||
}, // 解除禁言
|
||||
{
|
||||
value: 'CancelSpeech',
|
||||
label: $t('conference.cancel_speak'),
|
||||
}, // 取消发言
|
||||
{
|
||||
value: 'UnMute',
|
||||
label: $t('conference.control.unmute'),
|
||||
}, // 解除静音
|
||||
{
|
||||
value: 'OpenCamera',
|
||||
label: $t('conference.control.openCamera'),
|
||||
}, // 打开摄像头
|
||||
{
|
||||
value: 'AsMember',
|
||||
label: $t('conference.control.setAsMember'),
|
||||
}, // 设置为成员
|
||||
// {
|
||||
// value: 'CancelImage',
|
||||
// label: $t('conference.control.cancel.image'),
|
||||
// },// 取消指定
|
||||
];
|
||||
});
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
// 已入会-管控操作
|
||||
const getControlList = computed(() => {
|
||||
const operations = [
|
||||
{
|
||||
value: 'Prohibition',
|
||||
label: $t('meeting.modal.control_voice_text'),
|
||||
}, // 禁言
|
||||
{
|
||||
value: 'Mute',
|
||||
label: $t('conference.control.muteMember'),
|
||||
}, // 静音
|
||||
{
|
||||
value: 'CloseCamera',
|
||||
label: $t('conference.control.closeCamera'),
|
||||
}, // 关闭摄像头
|
||||
{
|
||||
value: 'AsHost',
|
||||
label: $t('conference.control.setAsHost'),
|
||||
}, // 设置为主席
|
||||
{
|
||||
value: 'Speech',
|
||||
label: $t('conference.control.designatedSpeech'),
|
||||
}, // 指定发言
|
||||
{
|
||||
value: 'ReName',
|
||||
label: $t('conference.control.reName'),
|
||||
}, // 修改昵称
|
||||
{
|
||||
value: 'Remove',
|
||||
label: $t('meeting.modal.control_move_text'),
|
||||
}, // 移除会议
|
||||
// {
|
||||
// value: 'AppointImage',
|
||||
// label: $t('conference.control.appoint.image'),
|
||||
// },// 指定画面
|
||||
];
|
||||
|
||||
return globalStore.IS_CURRENT_MEETING_OWNER
|
||||
? operations
|
||||
: operations.filter((v) => v.value === 'ReName');
|
||||
});
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const activeStatus = computed(() => {
|
||||
return true;
|
||||
});
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const mouseEnterItem = (index: number) => {
|
||||
if (reliveVisible.value || controlVisible.value) {
|
||||
return;
|
||||
}
|
||||
emit('changeCurrentIndex', index);
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const mouseLeaveItem = () => {
|
||||
if (reliveVisible.value || controlVisible.value) {
|
||||
return;
|
||||
}
|
||||
emit('changeCurrentIndex', -1);
|
||||
};
|
||||
|
||||
// 解除选择
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const reliveSelect = (val) => {
|
||||
emit('reliveSelect', {
|
||||
val,
|
||||
record: props.userInfo,
|
||||
});
|
||||
};
|
||||
|
||||
// 控制选择
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const controlSelect = (val, index) => {
|
||||
emit('controlSelect', {
|
||||
val,
|
||||
record: props.userInfo,
|
||||
});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.currentIndex,
|
||||
() => {
|
||||
reliveVisible.value = false;
|
||||
controlVisible.value = false;
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.user_item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid #3c4046;
|
||||
|
||||
&.user_item_active {
|
||||
background: #353b43;
|
||||
}
|
||||
|
||||
.user_item_info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.user_item_info_name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-left: 5px;
|
||||
line-height: 18px;
|
||||
|
||||
.type {
|
||||
min-width: 200px;
|
||||
color: #80848b;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
.user_item_opration {
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
|
||||
&:nth-child(2) {
|
||||
margin: 0 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.no_meeting_btn {
|
||||
img {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user_mask {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 10px;
|
||||
background: #353b43;
|
||||
transform: translateY(-50%);
|
||||
|
||||
> button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon_box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
836
src/components/Consultation/memberMangerModal/index.vue
Normal file
836
src/components/Consultation/memberMangerModal/index.vue
Normal file
@ -0,0 +1,836 @@
|
||||
<template lang="pug">
|
||||
a-modal(
|
||||
v-model:visible="visible"
|
||||
title-align="start"
|
||||
class="userMangeModal"
|
||||
width="648px"
|
||||
:title="`${$t('meeting.modal.user.title')} (${userList.length})`"
|
||||
popup-container=".arco-layout-content"
|
||||
:mask="false"
|
||||
unmount-on-close
|
||||
draggable
|
||||
@close="closeFn"
|
||||
@open="fetchMemberList")
|
||||
a-space(direction="vertical" fill)
|
||||
a-space(direction="vertical" fill)
|
||||
a-button(@click="invitVisible = true") {{ $t('conference.components.media.footer.defaultBtns.invitingAttendees') }}
|
||||
|
||||
a-tabs(
|
||||
default-active-key="1"
|
||||
class="userMange_tab"
|
||||
v-model:active-key="tabVal")
|
||||
|
||||
a-tab-pane(key="1" :title="`${$t('conference.member.present')} (${meetingMembers.length})`")
|
||||
.user_list
|
||||
user-item(
|
||||
v-for="(item, index) in meetingMembers"
|
||||
:key="`present_${item.basedata_id}`"
|
||||
:userInfo="item"
|
||||
:index="index"
|
||||
:currentIndex="currentIndex"
|
||||
:isShowType="true"
|
||||
meetingType="meeting"
|
||||
@reliveSelect="(params) => meetingControlSelect(params, 0)"
|
||||
@controlSelect="(params) => meetingControlSelect(params, 1)"
|
||||
@changeCurrentIndex="changeCurrentIndex")
|
||||
div.footer_btn
|
||||
a-button.btn(@click="() => setAllMemberProhibition(MICROPHONE_STATUS_OPEN)") {{ $t('conference.control.allBan') }}
|
||||
a-button.btn(@click="() => setAllMemberProhibition(MICROPHONE_STATUS_CLOSE)") {{ $t('conference.control.openAllBan') }}
|
||||
|
||||
a-tab-pane(key="2" :title="`${$t('conference.member.absent')} (${notMeetingMembers.length})`")
|
||||
.user_list
|
||||
user-item(
|
||||
v-for="(item, index) in notMeetingMembers"
|
||||
:key="`absent_${item.basedata_id}`"
|
||||
:userInfo="item"
|
||||
:index="index"
|
||||
:currentIndex="currentIndex"
|
||||
:isShowType="true"
|
||||
meetingType="noMeet"
|
||||
@reliveSelect="(params) => noMeetControlSelect(params, 0)"
|
||||
@controlSelect="(params) => noMeetControlSelect(params, 1)"
|
||||
@changeCurrentIndex="changeCurrentIndex")
|
||||
.user_footer
|
||||
|
||||
|
||||
a-modal(
|
||||
v-model:visible="invitVisible"
|
||||
title-align="start"
|
||||
width="648px"
|
||||
:title="`${$t('conference.components.media.footer.defaultBtns.invitingAttendees')} (${tableData.length})`"
|
||||
:mask="false"
|
||||
popup-container=".arco-layout-content"
|
||||
unmount-on-close
|
||||
@close="onInvitModalClose"
|
||||
@ok="addMember")
|
||||
a-space(fill style="margin-bottom: 10px")
|
||||
a-input-search(v-model="memberNumber")
|
||||
a-button(
|
||||
shape="circle"
|
||||
@click="addMemberByNumber")
|
||||
template(#icon)
|
||||
icon-plus
|
||||
|
||||
a-table(
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
row-key="rowKey"
|
||||
:data="tableData"
|
||||
:columns="rightColumns"
|
||||
:pagination="false"
|
||||
:scroll="{ y: '100%' }"
|
||||
@dragover="(e) => e.preventDefault()"
|
||||
@drop="handleDrop")
|
||||
template(#name="{ record }") {{ record.alias || record.number }}
|
||||
template(#optional="{ record }")
|
||||
icon-close(class="iconClose"
|
||||
@click="() => deleteSelection(record)")
|
||||
|
||||
a-modal(
|
||||
v-model:visible="reNnameVisible"
|
||||
title-align="start"
|
||||
width="648px"
|
||||
:title="`${$t('conference.control.reName')}`"
|
||||
:mask="true"
|
||||
popup-container=".arco-layout-content"
|
||||
unmount-on-close
|
||||
@ok="modifyMemberNickname")
|
||||
<a-input v-model="nickname" :style="{width:'320px'}" allow-clear />
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
getCurrentInstance,
|
||||
h,
|
||||
onMounted,
|
||||
onBeforeMount,
|
||||
} from 'vue';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import { IconDelete } from '@arco-design/web-vue/es/icon';
|
||||
|
||||
import ResultModal from '@/views/webPuc/resourcesAndGroup/group/components/resultModal.vue';
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
import AddGroup from '@/views/webPuc/resourcesAndGroup/group/components/addGroupNew.vue';
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
import { $t } from '@/locale';
|
||||
import useCallModule from '@/sdk/call';
|
||||
import useBaseDataModule from '@/components/Consultation/sdk/baseData';
|
||||
import useConferenceControlModule, {
|
||||
CONFERENCE_ROLE_NORMAL,
|
||||
CONFERENCE_ROLE_HOST,
|
||||
MICROPHONE_STATUS_NO,
|
||||
MICROPHONE_STATUS_OPEN,
|
||||
MICROPHONE_STATUS_CLOSE,
|
||||
MUTE_STATUS_Y,
|
||||
MUTE_STATUS_N,
|
||||
CAMERA_STATUS_NO,
|
||||
CAMERA_STATUS_OPEN,
|
||||
CAMERA_STATUS_CLOSE,
|
||||
} from '@/components/Consultation/sdk/conferenceControl';
|
||||
import useConferencModule from '@/components/Consultation/sdk/conferenceControl';
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
import UserItem from './components/UserItem.vue';
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
import SearchList from './components/SearchList.vue';
|
||||
import tableColAvatar from '@/views/webPuc/org/components/tableColAvatarByNumType.vue';
|
||||
|
||||
import { useGlobalStore, resourcesStore } from '@/store';
|
||||
|
||||
const globalStore = useGlobalStore();
|
||||
|
||||
const props = defineProps({
|
||||
cptCurrentConference: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
|
||||
const Modal = getCurrentInstance().appContext.config.globalProperties.$modal;
|
||||
const bus: any = getCurrentInstance().appContext.config.globalProperties.$bus;
|
||||
|
||||
// 新的成员昵称
|
||||
const reNnameVisible = ref(false);
|
||||
const currentMember = ref(null);
|
||||
const nickname = ref('');
|
||||
|
||||
// 会议信息
|
||||
const conference_info = ref<any>({});
|
||||
const visible = ref(false);
|
||||
const invitVisible = ref(false);
|
||||
const currentIndex = ref(-1);
|
||||
const searchCurrentIndex = ref(-1);
|
||||
const searchBoxStatus = ref(false);
|
||||
const searchContent = ref('');
|
||||
const tabVal = ref('1');
|
||||
const searchCollapse = ref(['1', '2']);
|
||||
const tempModalVisible = ref(false);
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const editData = ref<Record<string, any> | undefined>({});
|
||||
/** 临时组modal编辑传入数据 */
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const hideData = ref(['alias', 'number', 'timeInterval', 'autoDelete']);
|
||||
|
||||
const userList = computed(
|
||||
() => globalStore.activeMeetingConfig?.members || []
|
||||
);
|
||||
|
||||
const storeResources = resourcesStore();
|
||||
|
||||
// 入会成员
|
||||
const meetingMembers = computed(() => {
|
||||
return userList.value.filter((v) => v.member_state === 1); // member_state 成员会议中的状态 0=未入会，1=已入会，2=呼叫中
|
||||
});
|
||||
|
||||
// 未入会成员
|
||||
const notMeetingMembers = computed(() => {
|
||||
return userList.value.filter((v) => v.member_state !== 1);
|
||||
});
|
||||
|
||||
const searchMeetingList = ref([]);
|
||||
const searchNoMeetList = ref([]);
|
||||
|
||||
const CALL = useCallModule();
|
||||
|
||||
const useBDModule = useBaseDataModule();
|
||||
const conferenceControlModule = useConferenceControlModule();
|
||||
const conferenceModule = useConferencModule();
|
||||
|
||||
// 邀请会议成员相关
|
||||
const addMember = () => {
|
||||
console.log('邀请成员入会 = ', tableData.value);
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceModule
|
||||
.addConferenceMember({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
members: tableData.value,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
Message.success($t(`public.use.success`));
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const memberNumber = ref('');
|
||||
|
||||
// 拨号添加会议成员
|
||||
const addMemberByNumber = () => {
|
||||
const isError =
|
||||
!memberNumber.value || Number.isNaN(Number(memberNumber.value));
|
||||
|
||||
if (isError) {
|
||||
Message.error($t('common.number.invalid'));
|
||||
return;
|
||||
}
|
||||
|
||||
// 走通用的拖放逻辑
|
||||
storeResources.setActiveResource({
|
||||
number: memberNumber.value,
|
||||
});
|
||||
|
||||
storeResources.setResourceListAuto();
|
||||
|
||||
// 重置数据
|
||||
memberNumber.value = '';
|
||||
};
|
||||
|
||||
const selectedKeys = ref<string[]>([]);
|
||||
|
||||
const tableData = computed<any[]>(() => {
|
||||
const data = storeResources.getResourceList.map((item) => {
|
||||
return {
|
||||
...item,
|
||||
rowKey: item.basedata_id || item.number,
|
||||
};
|
||||
});
|
||||
console.info('table data ', data);
|
||||
return data;
|
||||
});
|
||||
|
||||
const rightColumns = computed<any[]>(() => {
|
||||
const columns: any[] = [
|
||||
{
|
||||
title: `${$t(`groupList.columns.member`)}（${tableData.value.length}）`,
|
||||
dataIndex: 'alias',
|
||||
slotName: 'name',
|
||||
align: 'left',
|
||||
width: 250,
|
||||
},
|
||||
];
|
||||
|
||||
let extraColumns: any[] = [];
|
||||
|
||||
const operation: any = {
|
||||
slotName: 'optional',
|
||||
align: 'right',
|
||||
fixed: 'right',
|
||||
width: 100,
|
||||
title: () => {
|
||||
return h(IconDelete, {
|
||||
style: { cursor: 'pointer' },
|
||||
onClick: () => {
|
||||
const newList = storeResources.getResourceList.filter(
|
||||
(item) => item.device_guid === sessionStorage.getItem('user_guid')
|
||||
);
|
||||
storeResources.setResourceList(newList);
|
||||
},
|
||||
});
|
||||
},
|
||||
};
|
||||
return columns.concat(extraColumns, operation);
|
||||
});
|
||||
|
||||
const rowSelection = computed<any>(() => {
|
||||
return {
|
||||
// type: 'checkbox',
|
||||
showCheckedAll: true,
|
||||
};
|
||||
});
|
||||
|
||||
// 穿梭框-右侧-删除选择行事件
|
||||
const deleteSelection = (record: any) => {
|
||||
console.info('deleteSelection', record);
|
||||
// 会议主持人不允许删掉
|
||||
if (record.guid === sessionStorage.getItem('user_guid')) {
|
||||
Message.warning($t('meeting.tip.no_can_del'));
|
||||
} else {
|
||||
// dgna_guid是唯一标识符
|
||||
const filterData = tableData.value.filter((item) => {
|
||||
return item?.rowKey !== record.rowKey;
|
||||
});
|
||||
storeResources.setResourceList(filterData);
|
||||
selectedKeys.value = selectedKeys.value.filter((selected) =>
|
||||
tableData.value.some((data) => data.rowKey === selected)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
// 拖拽
|
||||
const beforeDropdown = (
|
||||
record: Record<string, any>
|
||||
// allRecords: Record<string, any>[]
|
||||
) => {
|
||||
const result = {
|
||||
success: true,
|
||||
message: 'success',
|
||||
formattedData: {},
|
||||
};
|
||||
|
||||
console.info('----sdf->>>>>', record);
|
||||
|
||||
// 错误的数据格式或过滤已有userlist
|
||||
if (
|
||||
!record.guid ||
|
||||
tableData.value?.some((item) => item.guid === record.guid)
|
||||
) {
|
||||
result.success = false;
|
||||
result.message = $t(`${$t('meeting.modal.userExit')}`);
|
||||
return result;
|
||||
}
|
||||
|
||||
result.formattedData = {
|
||||
...record,
|
||||
};
|
||||
return result;
|
||||
};
|
||||
|
||||
// 拖拽置入table事件 dropdown
|
||||
const handleDrop = async () => {
|
||||
const emitResult = beforeDropdown(storeResources.getActiveResource);
|
||||
|
||||
if (!emitResult) {
|
||||
storeResources.setResourceListAuto();
|
||||
} else if (emitResult.success) {
|
||||
if (emitResult.formattedData) {
|
||||
storeResources.setActiveResource(emitResult.formattedData);
|
||||
}
|
||||
storeResources.setResourceListAuto();
|
||||
} else {
|
||||
Message.error(emitResult.message);
|
||||
}
|
||||
};
|
||||
|
||||
// 弹窗关闭时
|
||||
const onInvitModalClose = () => {
|
||||
storeResources.setResourceList([]);
|
||||
};
|
||||
|
||||
// 踢出会议成员
|
||||
const kickoutMember = (record) => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.kickoutMember({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
members: [record],
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
Message.success($t('meeting.deleteUser.success'));
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('meeting.deleteUser.fail'));
|
||||
});
|
||||
};
|
||||
|
||||
// 呼叫未入会成员
|
||||
const inviteMember = (record) => {
|
||||
const { meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.inviteMember({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
members: [record],
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
Message.success($t(`public.use.success`));
|
||||
} else {
|
||||
Message.warning($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.error($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 呼叫全部未入会成员
|
||||
const inviteAllMember = () => {
|
||||
const { meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.inviteAllMember({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
Message.success($t(`public.use.success`));
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 修改成员昵称
|
||||
const modifyMemberNickname = () => {
|
||||
if (nickname.value === currentMember.value.nick) return;
|
||||
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.modifyMemberNickname({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
member: currentMember.value,
|
||||
nickname: nickname.value,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
nickname.value = '';
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 设置会员成员角色
|
||||
const setMemberRole = (role: number) => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.setMemberRole({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
member: currentMember.value,
|
||||
role,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 禁言会议成员
|
||||
const setMemberProhibition = (prohibition: number) => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.setMemberProhibition({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
member: currentMember.value,
|
||||
prohibition,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 禁言全部会议成员
|
||||
const setAllMemberProhibition = (prohibition: number) => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.setAllMemberProhibition({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
prohibition,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 静音会议成员
|
||||
const setMemberMute = (mute: number) => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.setMemberMute({
|
||||
guid: meeting.guid,
|
||||
basedata_id: meeting.basedata_id,
|
||||
call_id: callId,
|
||||
member: currentMember.value,
|
||||
mute,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 开关会议成员摄像头
|
||||
const setMemberCamera = (camera_status: number) => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.setMemberCamera({
|
||||
guid: meeting.guid,
|
||||
basedata_id: meeting.basedata_id,
|
||||
call_id: callId,
|
||||
member: currentMember.value,
|
||||
camera_status,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 指定成员发言
|
||||
const assignMemberSpeaker = () => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.assignMemberSpeaker({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
member: currentMember.value,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// 取消指定成员发言
|
||||
const cancelMemberSpeak = () => {
|
||||
const { members, meeting, callId } = globalStore.activeMeetingConfig;
|
||||
|
||||
conferenceControlModule
|
||||
.cancelMemberSpeak({
|
||||
guid: meeting?.guid,
|
||||
basedata_id: meeting?.basedata_id,
|
||||
call_id: callId,
|
||||
member: currentMember.value,
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.result === 0) {
|
||||
} else {
|
||||
Message.error($t(`errorCode.${resp.result}`));
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Message.warning($t('gis.cross.delResult1'));
|
||||
});
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const meetingControlSelect = ({ val, record }, type) => {
|
||||
console.info('meetingControlSelect', val, record);
|
||||
|
||||
currentMember.value = record;
|
||||
|
||||
switch (val) {
|
||||
case 'Remove': // 移除会议成员
|
||||
kickoutMember(record);
|
||||
break;
|
||||
|
||||
case 'AsMember': // 设置为成员
|
||||
setMemberRole(CONFERENCE_ROLE_NORMAL);
|
||||
break;
|
||||
|
||||
case 'AsHost': // 设置为主席
|
||||
setMemberRole(CONFERENCE_ROLE_HOST);
|
||||
break;
|
||||
|
||||
case 'Prohibition': // 禁言
|
||||
setMemberProhibition(MICROPHONE_STATUS_OPEN);
|
||||
break;
|
||||
|
||||
case 'ReleaseProhibition': // 解除禁言
|
||||
setMemberProhibition(MICROPHONE_STATUS_CLOSE);
|
||||
break;
|
||||
|
||||
case 'Mute': // 静音
|
||||
setMemberMute(MUTE_STATUS_Y);
|
||||
break;
|
||||
|
||||
case 'UnMute': // 解除静音
|
||||
setMemberMute(MUTE_STATUS_N);
|
||||
break;
|
||||
|
||||
case 'OpenCamera': // 打开摄像头
|
||||
setMemberCamera(CAMERA_STATUS_OPEN);
|
||||
break;
|
||||
|
||||
case 'CloseCamera': // 关闭摄像头
|
||||
setMemberCamera(CAMERA_STATUS_CLOSE);
|
||||
break;
|
||||
|
||||
case 'ReName': // 修改昵称
|
||||
reNnameVisible.value = true;
|
||||
nickname.value = record.nick || '';
|
||||
break;
|
||||
|
||||
case 'Speech': // 指定成员发言
|
||||
assignMemberSpeaker();
|
||||
break;
|
||||
|
||||
case 'CancelSpeech': // 取消指定成员发言
|
||||
cancelMemberSpeak();
|
||||
break;
|
||||
|
||||
case 'AppointImage': // 指定画面
|
||||
break;
|
||||
|
||||
case 'CancelImage': // 取消指定画面
|
||||
break;
|
||||
|
||||
default:
|
||||
console.info(val);
|
||||
}
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const noMeetControlSelect = ({ val, record }, type) => {
|
||||
console.info('noMeetControlSelect', record);
|
||||
|
||||
switch (val) {
|
||||
case 'FullDuplexCall': // 全双工呼叫
|
||||
inviteMember(record);
|
||||
break;
|
||||
|
||||
case 'HalfDuplexCall': // 半双工呼叫
|
||||
inviteMember(record);
|
||||
break;
|
||||
|
||||
case 'AllCall': // 呼叫所有未入会成员
|
||||
inviteAllMember();
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
const init = () => {
|
||||
currentIndex.value = -1;
|
||||
searchCurrentIndex.value = -1;
|
||||
searchBoxStatus.value = false;
|
||||
searchContent.value = '';
|
||||
tabVal.value = '1';
|
||||
searchCollapse.value = ['1', '2'];
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const closeFn = () => {
|
||||
init();
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const changeCurrentIndex = (index) => {
|
||||
currentIndex.value = index;
|
||||
};
|
||||
|
||||
const closeAllModal = () => {
|
||||
visible.value = false;
|
||||
invitVisible.value = false;
|
||||
reNnameVisible.value = false;
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
visible,
|
||||
closeAllModal,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.userMangeModal {
|
||||
.arco-modal-footer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search_result_box {
|
||||
.user_list {
|
||||
.user_item_info {
|
||||
.avatar {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.user_item_opration {
|
||||
img {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
.no_meeting_btn {
|
||||
font-size: 12px;
|
||||
|
||||
img {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped lang="less">
|
||||
.userMangeModal {
|
||||
.search_box {
|
||||
position: relative;
|
||||
|
||||
.search_result_box {
|
||||
position: absolute;
|
||||
top: 34px;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
width: 320px;
|
||||
height: 224px;
|
||||
overflow-y: scroll;
|
||||
background: #2d3238;
|
||||
border: 1px solid #3c4046;
|
||||
border-radius: 4px;
|
||||
// padding: 22px 16px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
|
||||
|
||||
/deep/.arco-collapse-item {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/deep/.arco-collapse-item-header {
|
||||
background: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/deep/.arco-collapse-item-content {
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/deep/.arco-collapse-item-content-box {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.userMange_tab {
|
||||
.arco-tabs-content {
|
||||
padding: 0;
|
||||
|
||||
.user_list {
|
||||
min-height: 367px;
|
||||
max-height: 367px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.user_footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
|
||||
/deep/.arco-btn {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer_btn {
|
||||
margin-top: 30px;
|
||||
|
||||
.btn {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user