|
@@ -3,7 +3,7 @@ import {computed, ref} from 'vue'
|
|
|
import {useClassify} from '../hooks/useClassify'
|
|
|
import openShareIcon from '@/assets/imgs/ppt/ppt_icon_user1.png'
|
|
|
import closeShareIcon from '@/assets/imgs/ppt/ppt_icon_user2.png'
|
|
|
-import {apiPPTList,apiPPTPubList} from '@/api/ppt'
|
|
|
+import {apiPPTList,apiPPTPubList,apiPPTShareList} from '@/api/ppt'
|
|
|
import { useRouter } from 'vue-router'
|
|
|
import moment from 'moment'
|
|
|
import {useCachedViewsStore} from '@/store/modules/cachedViews'
|
|
@@ -32,16 +32,26 @@ const {
|
|
|
|
|
|
goPPTDetail,
|
|
|
|
|
|
+ handleSetPPTShared,
|
|
|
+ PPTSetSharedOptState,
|
|
|
+ PPTSetSharedOptMethods,
|
|
|
+ getResearcherList,
|
|
|
+ researcherList,
|
|
|
+
|
|
|
+ chooseMemberOptState,
|
|
|
+ chooseMemberOptMethods,
|
|
|
+ handleChooseMember,
|
|
|
+
|
|
|
permissionBtn,
|
|
|
checkAuthBtn
|
|
|
}=useClassify()
|
|
|
getPPTClassifyData()
|
|
|
-
|
|
|
+getResearcherList()
|
|
|
const isOptBoxShow = computed(()=>{
|
|
|
return checkAuthBtn(permissionBtn.ppt_copy)||checkAuthBtn(permissionBtn.ppt_save)||checkAuthBtn(permissionBtn.ppt_del)
|
|
|
})
|
|
|
const isOptPPTShow = computed(()=>{
|
|
|
- return checkAuthBtn(permissionBtn.ppt_copy)||checkAuthBtn(permissionBtn.ppt_del)
|
|
|
+ return checkAuthBtn(permissionBtn.ppt_copy)||checkAuthBtn(permissionBtn.ppt_del) || checkAuthBtn(permissionBtn.ppt_setShare)
|
|
|
})
|
|
|
const activeType=ref('myPPT')
|
|
|
|
|
@@ -52,6 +62,8 @@ async function getPPTList(){
|
|
|
let res
|
|
|
if(activeType.value=='myPPT'){
|
|
|
res=await apiPPTList({GroupId:activeGroupId.value})
|
|
|
+ } else if(activeType.value=='sharedPPT'){
|
|
|
+ res=await apiPPTShareList({GroupId:activeGroupId.value})
|
|
|
}else{
|
|
|
res=await apiPPTPubList({AdminId:activeGroupId.value})
|
|
|
}
|
|
@@ -98,6 +110,10 @@ const showPopover=ref(false)
|
|
|
:class="activeType=='myPPT'&&'active'"
|
|
|
@click="activeType='myPPT'"
|
|
|
>我的PPT</span>
|
|
|
+ <span
|
|
|
+ :class="activeType=='sharedPPT'&&'active'"
|
|
|
+ @click="activeType='sharedPPT'"
|
|
|
+ >共享PPT</span>
|
|
|
<span
|
|
|
:class="activeType=='pubPPT'&&'active'"
|
|
|
@click="activeType='pubPPT'"
|
|
@@ -147,7 +163,7 @@ const showPopover=ref(false)
|
|
|
@click.stop="goPPTDetail(_item)"
|
|
|
>
|
|
|
<span class="van-ellipsis text">{{ _item.Title }}</span>
|
|
|
- <div @click.stop="handleShowPPTOpt(_item)">
|
|
|
+ <div @click.stop="handleShowPPTOpt(_item,'myPPT')">
|
|
|
<van-popover position="bottom-start">
|
|
|
<template #reference>
|
|
|
<img class="share-icon" :src="_item.IsSingleShareBoolean?openShareIcon:closeShareIcon" alt="" v-if="checkAuthBtn(permissionBtn.ppt_visible)">
|
|
@@ -164,7 +180,7 @@ const showPopover=ref(false)
|
|
|
</div>
|
|
|
</van-popover>
|
|
|
</div>
|
|
|
- <div @click.stop="handleShowPPTOpt(_item)">
|
|
|
+ <div @click.stop="handleShowPPTOpt(_item,'myPPT')">
|
|
|
<van-popover position="bottom-start">
|
|
|
<template #reference>
|
|
|
<div class="menu-icon" v-if="isOptPPTShow">
|
|
@@ -176,6 +192,10 @@ const showPopover=ref(false)
|
|
|
<img src="@/assets/imgs/ppt/icon_action_copy.png" alt="">
|
|
|
<span>复制</span>
|
|
|
</div>
|
|
|
+ <div class="item" @click="handleSetPPTShared" v-if="!PPTOptState.isCommon&&checkAuthBtn(permissionBtn.ppt_setShare)">
|
|
|
+ <img src="@/assets/imgs/ppt/ppt_icon_set_shared_black.png" alt="">
|
|
|
+ <span>{{ PPTOptState.data.IsGrant ? '取消共享' : '设置共享' }}</span>
|
|
|
+ </div>
|
|
|
<div class="item del" @click="handlePPTDel" v-permission="permissionBtn.ppt_del">
|
|
|
<img src="@/assets/imgs/icon_del.png" alt="">
|
|
|
<span>删除</span>
|
|
@@ -188,6 +208,53 @@ const showPopover=ref(false)
|
|
|
</van-collapse-item>
|
|
|
</van-collapse>
|
|
|
</div>
|
|
|
+
|
|
|
+ <div class="classify-list" v-if="activeType=='sharedPPT'">
|
|
|
+ <van-collapse class="level-two" v-model="classifyState.sharedActiveType" :border="false">
|
|
|
+ <van-collapse-item
|
|
|
+ :name="item.GroupId"
|
|
|
+ v-for="item in classifyState.sharedList"
|
|
|
+ :key="item.GroupId"
|
|
|
+ :is-link="false"
|
|
|
+ >
|
|
|
+ <template #title>
|
|
|
+ <div class="title-second" @click="handleClickCatalogue(item)">
|
|
|
+ <img src="@/assets/imgs/ppt/ppt_icon_file.png" alt="">
|
|
|
+ <span class="van-ellipsis">{{item.GroupName}}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div
|
|
|
+ class="ppt-item"
|
|
|
+ v-for="_item in item.PptList"
|
|
|
+ :key="_item.GroupId"
|
|
|
+ @click.stop="goPPTDetail(_item)"
|
|
|
+ >
|
|
|
+ <span class="van-ellipsis text">{{ _item.Title }}</span>
|
|
|
+ <div v-if="_item.IsGrant" @click.stop="handleShowPPTOpt(_item,'sharedPPT')">
|
|
|
+ <van-popover position="bottom-start">
|
|
|
+ <template #reference>
|
|
|
+ <div class="menu-icon" v-if="checkAuthBtn(permissionBtn.ppt_setShare)">
|
|
|
+ <img class="icon" src="@/assets/imgs/ppt/ppt_icon_menu.png" alt="">
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="pad-classify-file-opt-box">
|
|
|
+ <div class="item" @click="handleSetPPTShared" v-if="!PPTOptState.isCommon&&checkAuthBtn(permissionBtn.ppt_setShare)">
|
|
|
+ <img src="@/assets/imgs/ppt/ppt_icon_set_shared_black.png" alt="">
|
|
|
+ <span>取消共享</span>
|
|
|
+ </div>
|
|
|
+ <div class="item" @click="handleChooseMember" v-if="!PPTOptState.isCommon&&PPTOptState.data.IsGrant">
|
|
|
+ <img src="@/assets/imgs/ppt/ppt_icon_choose_member_black.png" alt="">
|
|
|
+ <span>选择用户</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </van-popover>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </van-collapse-item>
|
|
|
+ </van-collapse>
|
|
|
+ </div>
|
|
|
+
|
|
|
<div class="classify-list" v-if="activeType=='pubPPT'">
|
|
|
<van-collapse class="level-two" v-model="classifyState.pubActiveType" :border="false">
|
|
|
<van-collapse-item
|
|
@@ -209,7 +276,7 @@ const showPopover=ref(false)
|
|
|
@click.stop="goPPTDetail(_item)"
|
|
|
>
|
|
|
<span class="van-ellipsis text">{{ _item.Title }}</span>
|
|
|
- <div @click.stop="handleShowPPTOpt(_item)">
|
|
|
+ <div @click.stop="handleShowPPTOpt(_item,'pubPPT')">
|
|
|
<van-popover position="bottom-start">
|
|
|
<template #reference>
|
|
|
<div class="menu-icon">
|
|
@@ -298,6 +365,71 @@ const showPopover=ref(false)
|
|
|
</van-popover>
|
|
|
</div>
|
|
|
</van-dialog>
|
|
|
+ <!-- 设置共享弹框 -->
|
|
|
+ <van-popup
|
|
|
+ v-model:show="PPTSetSharedOptState.show"
|
|
|
+ :close-on-click-overlay="false"
|
|
|
+ round
|
|
|
+ >
|
|
|
+ <div class="set-shared-popup">
|
|
|
+ <div class="set-shared-title">
|
|
|
+ <span @click="PPTSetSharedOptMethods.cancel" class="cancel" >取消</span>
|
|
|
+ <span class="title" >选择共享用户</span>
|
|
|
+ <span @click="PPTSetSharedOptMethods.save" class="confirm">确认</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="set-shared-radios">
|
|
|
+ <van-radio-group v-model="PPTSetSharedOptState.chooseType" shape="dot">
|
|
|
+ <van-cell-group inset>
|
|
|
+ <van-cell title="全部用户" clickable @click="PPTSetSharedOptState.chooseType = '1'">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-radio icon-size="16px" name="1" />
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <van-cell title="指定成员" clickable @click="PPTSetSharedOptState.chooseType = '2'">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-radio icon-size="16px" name="2" />
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-cell-group>
|
|
|
+ </van-radio-group>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="set-shared-result">
|
|
|
+ <div v-show="PPTSetSharedOptState.chooseType == '2'" class="choosed-member-wrap">
|
|
|
+ <div class="members-item-wrap">
|
|
|
+ <div v-for="item in PPTSetSharedOptState.members" :key="item.text+item.id" class="members-item">
|
|
|
+ <span>{{ item.text }}</span>
|
|
|
+ <img src="@/assets/imgs/ppt/ppt_icon_set_close.png" @click="PPTSetSharedOptMethods.delete(item)" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-show="PPTSetSharedOptState.chooseType == '2'" class="btn" @click="PPTSetSharedOptMethods.chooseMember">选择指定成员</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
+ <!-- 选择成员弹框 -->
|
|
|
+ <van-popup v-model:show="chooseMemberOptState.show" round :close-on-click-overlay="false">
|
|
|
+ <div class="choose-memeber-wrap">
|
|
|
+ <div class="choose-memeber-title">
|
|
|
+ <span>选择指定成员</span>
|
|
|
+ <img src="../../../assets/imgs/dataEDB/close_outline_black.png" @click="chooseMemberOptMethods.cancel">
|
|
|
+ </div>
|
|
|
+ <div class="choose-member-popup">
|
|
|
+ <van-sidebar v-model="chooseMemberOptState.slideActive" @change="chooseMemberOptMethods.change">
|
|
|
+ <van-sidebar-item v-for="item in researcherList" :title="item.text" :key="item.text+item.id"/>
|
|
|
+ </van-sidebar>
|
|
|
+ <van-tree-select
|
|
|
+ style="flex:1;height: 100%"
|
|
|
+ v-model:active-id="chooseMemberOptState.activeIdCopy"
|
|
|
+ v-model:main-active-index="chooseMemberOptState.activeIndex"
|
|
|
+ :items="chooseMemberOptState.acitiveItem"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="choose-memeber-footer" @click="chooseMemberOptMethods.save">确定</div>
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
</template>
|
|
|
|
|
|
<style lang="scss">
|
|
@@ -353,10 +485,127 @@ const showPopover=ref(false)
|
|
|
</style>
|
|
|
<style lang="scss" scoped>
|
|
|
@media screen and (min-width:$media-width){
|
|
|
+ .choose-memeber-wrap{
|
|
|
+ width: 375px;
|
|
|
+ .choose-memeber-title{
|
|
|
+ position: relative;
|
|
|
+ text-align: center;
|
|
|
+ padding: 17px 56px;
|
|
|
+ font-size: 16px;
|
|
|
+ border-bottom: 1px solid $border-color;
|
|
|
+ img{
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ position: absolute;
|
|
|
+ right: 17px;
|
|
|
+ top:50%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .choose-member-popup{
|
|
|
+ height: 27vh;
|
|
|
+ display: flex;
|
|
|
+ :deep(.van-sidebar-item){
|
|
|
+ padding: 14px 12px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .choose-memeber-footer{
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ text-align: center;
|
|
|
+ color: rgba(0, 82, 217, 1);
|
|
|
+ padding: 16px 0;
|
|
|
+ border-top: 1px solid $border-color;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .set-shared-popup{
|
|
|
+ width: 375px;
|
|
|
+ .set-shared-title{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: flex-end;
|
|
|
+ padding: 17px;
|
|
|
+ border-bottom: 1px solid $border-color;
|
|
|
+ font-size: 16px;
|
|
|
+ .title{
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .confirm{
|
|
|
+ color:rgba(0, 82, 217, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .set-shared-radios{
|
|
|
+ padding-top: 5px;
|
|
|
+ :deep(.van-cell-group--inset){
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ :deep(.van-cell__title){
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ :deep(.van-cell){
|
|
|
+ padding: 14px 17px;
|
|
|
+ }
|
|
|
+ :deep(.van-cell::after){
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ border: 1px solid $border-color;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .set-shared-result{
|
|
|
+ height: 23vh;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .choosed-member-wrap{
|
|
|
+ flex: 1;
|
|
|
+ overflow: auto;
|
|
|
+ .members-item-wrap{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 16px;
|
|
|
+ .members-item{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ vertical-align: middle;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: rgba(0, 82, 217, 1);
|
|
|
+ padding: 4px 8px;
|
|
|
+ background: rgba(248, 248, 248, 1);
|
|
|
+ margin: 8px;
|
|
|
+ img{
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ margin-left: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btn{
|
|
|
+ width: 341px;
|
|
|
+ height: 44px;
|
|
|
+ padding: 10px 20px 10px 20px;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: rgba(0, 82, 217, 1);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin:16px auto 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: rgba(255, 255, 255, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
.pad-ppt-index-wrap{
|
|
|
display: flex;
|
|
|
.left-classify-wrap{
|
|
|
- width: 300px;
|
|
|
+ width: 350px;
|
|
|
min-height: 100vh;
|
|
|
border-right: 1px solid $border-color;
|
|
|
padding: 30px;
|
|
@@ -541,7 +790,6 @@ const showPopover=ref(false)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-
|
|
|
}
|
|
|
|
|
|
</style>
|