Skip to content

P
pptist
Commit d4879fe4 authored by zhengke's avatar zhengke
Browse files
Options

云盘

parent 25d5df91
Show whitespace changes
Inline Side-by-side
Showing with 235 additions and 66 deletions
src/assets/styles/common.css
View file @ d4879fe4
......@@ -216,6 +216,9 @@ page {
flex-direction: row;
flex-wrap: nowrap;
}
.nowrap{
flex-wrap: nowrap;
}
.wrap{
flex-wrap: wrap !important;
}
......
src/components/CloudDisk/CloudDiskList.vue
View file @ d4879fe4
......@@ -13,10 +13,22 @@
<IconSearch class="cusor-pointer" @click.stop="refreshHandler"></IconSearch>
</template>
<template #append>
<el-select v-model="queryObj.QCreateBy" placeholder="Select" style="width: 100px"
@change="refreshHandler">
<el-option label="稿定模板" value="1" />
<el-option label="我的空间" value="2" />
<el-select v-model="queryObj.QCreateBy"
placeholder="人员名称"
style="width: 100px"
filterable
remote
reserve-keyword
:remote-method="remoteMethod"
:loading="CreateLoading"
@change="ClearOption(),refreshHandler()"
clearable>
<el-option
v-for="item in CreateList"
:key="item.EmployeeId"
:label="item.EmName"
:value="item.EmployeeId"
/>
</el-select>
</template>
</el-input>
......@@ -39,7 +51,7 @@
<div class="CloudDisk-L-Title row flex-between cusor-pointer"
v-for="(item,index) in GroupList"
:class="[queryObj.CloudGroupId==item.Id?'active':'']">
<span class="block" @click="refreshHandler(item)">{{item.GName}}</span>
<span class="block grow" @click="refreshHandler(item)">{{item.GName}}</span>
<div class="row" :key="index">
<template v-if="item.Id">
<el-dropdown class="q-pl-lg CloudDisk-L-TitleR" trigger="click">
......@@ -79,21 +91,21 @@
<template #dropdown>
<div class="q-py-lg q-px-lg">
<el-input
style="max-width:200px" v-model="queryObj.FileName" placeholder="搜索"
style="max-width:200px" v-model="queryObj.QFileName" placeholder="搜索"
class="input-with-select" clearable
@keyup.enter="refreshHandler" @input="SearchImg"
@input="SearchCloudInfo"
>
<template #prefix>
<IconSearch class="cusor-pointer" @click.stop="refreshHandler"></IconSearch>
</template>
</el-input>
<div class="row flex-between items-center q-pt-md">
<el-checkbox v-model="queryObj.QFileType" label="jpg" @change="refreshHandler"/>
<span></span>
<div class="row flex-between items-center q-pt-md" v-for="(item,index) in formatType">
<div class="grow">
<el-checkbox style="width: 100%;" v-model="queryObj.QFileType"
:label="item.FileFormat"
@change="ClearOption(),refreshHandler()"></el-checkbox>
</div>
<div class="row flex-between items-center q-pt-md">
<el-checkbox v-model="queryObj.QFileType" label="png" @change="refreshHandler"/>
<span></span>
<span>{{item.RecordNum}}</span>
</div>
</div>
</template>
......@@ -115,7 +127,7 @@
end-placeholder=""
value-format="YY-MM-DD"
ref="dropdownDade"
@change="getDate"
@change="ClearOption(),getDate()"
/>
</div>
</div>
......@@ -133,7 +145,7 @@
<el-dropdown-menu>
<template v-for="(item,index) in sortType">
<el-dropdown-item :command="item.ID" class="row flex-between"
@click="setDropdown(item,1)">
@click="ClearOption(),setDropdown(item,1)">
<span style="width: 80px;">{{item.Name}}</span>
<IconCheck class="q-pl-lg" v-if="item.check"></IconCheck>
</el-dropdown-item>
......@@ -141,7 +153,7 @@
<template v-for="(item,index) in sortTypeUD">
<el-dropdown-item :command="item.ID" class="row flex-between"
:divided="index==0?true:false"
@click="setDropdown(item,2)">
@click="ClearOption(),setDropdown(item,2)">
<span style="width: 80px;">{{item.Name}}</span>
<IconCheck class="q-pl-lg" v-if="item.check"></IconCheck>
</el-dropdown-item>
......@@ -182,7 +194,7 @@
</div>
<div ref="imgDiskRef" class="full-height" style="padding-top: 10px;overflow:auto"
:style="{'padding-bottom':queryObj.pageCount == queryObj.pageIndex && !loading?'60px':'130px'}">
<cellList v-show="queryObj.layout==1" :dataList="dataList"
<cellList v-if="queryObj.layout==1" :dataList="dataList"
@refreshHandler="refreshHandler"
@CopyTo="CopyTo"
@MoveFile="MoveFile"
......@@ -191,7 +203,7 @@
@MultipleChoice="MultipleChoice"
:Parent="datas"
></cellList>
<waterfallFlowList v-show="queryObj.layout==2" :dataList="dataList"
<waterfallFlowList v-if="queryObj.layout==2" :dataList="dataList"
@refreshHandler="refreshHandler"
@CopyTo="CopyTo"
@MoveFile="MoveFile"
......@@ -207,6 +219,9 @@
@getImg="getImg"
@deleteImg="deleteImg"
@MultipleChoice="MultipleChoice"
@BatchRemove="BatchRemove"
@BatchCopyTo="BatchCopyTo"
@BatchMoveFile="BatchMoveFile"
:Parent="datas"
:params="queryObj"
></list>
......@@ -232,19 +247,18 @@
<div class="CloudDisk-RBFCenter microsoft">
<div class="row flex-center">
<div class="CloudDisk-RBFbj rounded row items-center">
<div class="row items-center">
<div class="row items-center nowrap shrink">
<el-checkbox class="fz14" label="全选" v-model="datas.selectAll"
:indeterminate="datas.indeterminate" style="position: relative;top: 1px;"
@change="setSelecAll"/>
<span class="fz14 q-pl-md color959AA3"><span>已选择</span> <span class="q-pl-xs">{{datas.SelectedDatas.length}}</span></span>
<span class="fz14 q-pl-md color959AA3 row nowrap"><span>已选择</span> <span class="q-pl-xs">{{datas.SelectedDatas.length}}</span></span>
</div>
<div class="q-px-lg">
<div style="border-right: 1px solid #BABABA;height: 13px;">&nbsp;</div>
</div>
<el-button icon="CopyDocument" size="small" @click="CopyTo()">复制到</el-button>
<el-button icon="Expand" size="small" @click="CopyTo()">移动到</el-button>
<el-button icon="Delete" size="small" @click="CopyTo()">删除</el-button>
<!-- <el-button icon="View" size="small" @click="CopyTo()">查看</el-button> -->
<el-button icon="CopyDocument" size="small" @click="BatchCopyTo()">复制到</el-button>
<el-button icon="Expand" size="small" @click="BatchMoveFile()">移动到</el-button>
<el-button icon="Delete" size="small" @click="BatchRemove()">删除</el-button>
<span class="close-btn cursor-pointer column items-center flex-center q-pl-md" @click="datas.ControlsShow=false">
<IconClose :size="14"></IconClose>
</span>
......@@ -272,7 +286,7 @@
:GroupId="GroupId"
:GroupList="GroupAll"
@close="close"
@success="close(),dialogCMVisible=false,SearchGroup(),refreshHandler()"></copyMove>
@success="successCM"></copyMove>
<!-- 预览图 -->
<el-image-viewer
@close="() => { isViewerShow = false }"
......@@ -283,7 +297,7 @@
</template>
<script setup lang="ts">
import { ref, reactive, watch, provide, inject, onMounted, PropType, nextTick, onBeforeUnmount } from "vue";
import type { ElMessage,ElImage,DropdownInstance } from "element-plus";
import type { ElMessage,ElImage,DropdownInstance,ElLoading } from "element-plus";
import { ArrowLeft,CopyDocument } from "@element-plus/icons-vue";
import CloudDiskService from "@/services/CloudDiskService";
import { injectKeyTemplate } from "@/types/injectKey";
......@@ -324,6 +338,7 @@
QOrderFiled: 1,//排序字段(1-创建时间，2-文件大小 3文件名称
QOrderBy: 2,//1-升序，2-倒序
QCreateBy: '',//上传人员
QFileName: '',
})
const dateArr = ref([time[0],time[1]] as any)
......@@ -383,12 +398,111 @@
SelectedDatas: [] as Array,
ControlsShow: true,// 批量操作显示
indeterminate: false,// 未全选状态
IdList: [] as any,
})
const formatType = ref([] as any)
const formatTypeAll = ref([] as any)
const CreateLoading = ref(false)
const CreateList = ref([] as any)
layoutType.value.forEach(x=>{
if(x.ID==queryObj.layout) x.check = true
})
const remoteMethod = async (query: string) => {
if (query) {
CreateLoading.value = true
const response = await CloudDiskService.GetEmpByEmpNameKey(query);
if (response.data.resultCode==ApiResult.SUCCESS) {
CreateList.value = response.data.data
}
CreateLoading.value = false
} else {
}
}
const SearchCloudInfo = () => {
if(queryObj.QFileName) formatType.value = formatTypeAll.value.filter((item) => {
return item.FileFormat.toLowerCase().includes(queryObj.QFileName.toLowerCase())
})
else formatType.value = formatTypeAll.value
}
const getCloudInfo = async () => {
let QUserType = 0
if(props.isPersonage) QUserType = 2
const response = await CloudDiskService.GetPPTistCloudInfoFileFormatCount(QUserType);
if (response.data.resultCode==ApiResult.SUCCESS) {
formatType.value = response.data.data
formatTypeAll.value = response.data.data
}
}
const ClearOption = () =>{
datas.IdList = []
datas.SelectedDatas = []
datas.selectAll = false
datas.indeterminate = false
}
const successCM = (type:any) =>{
if(type){
ClearOption()
}
close()
dialogCMVisible.value = false
querySearchGroup()
refreshHandler()
}
const BatchCopyTo = () => {
addEditMsg.Id = datas.IdList
GroupId.value = ''
dialogType.value = 1
dialogCMVisible.value = true
}
const BatchMoveFile = () => {
addEditMsg.Id = datas.IdList
GroupId.value = ''
dialogType.value = 2
dialogCMVisible.value = true
}
const BatchRemove = () => {
let text = ''
let mobel = ''
let material = ''
let mobelTisp = '模板图会影响模板正常使用，将无法恢复'
let findCanDelete = datas.SelectedDatas.find(y=> y.IsCanDelete)
let findObj = datas.SelectedDatas.find(y=> !y.IsCanDelete)
if(findCanDelete) mobel = `模板图`
if(findObj) material = '素材图'
text = `删除${mobel&&material?''+mobel+'、':mobel&&!material?mobelTisp:''}${material}${mobel&&material?'，删除'+mobelTisp:''}，是否确定?`
ElMessageBox.confirm(
`${text}`,
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
).then(async () => {
try {
loading.value = true
let dataRes = await CloudDiskService.BatchRemoveCloudInfo(datas.IdList)
if (dataRes.data.resultCode==ApiResult.SUCCESS) {
ClearOption()
querySearchGroup()
refreshHandler()
}
loading.value = false
} catch (error) {}
}).catch(() => {})
}
const newDatasSelected = () =>{
if(datas.SelectedDatas.length==0) {
for(let i=0;i<dataList.value.length;i++){
......@@ -406,7 +520,7 @@
}else if(dataList.value.length>datas.SelectedDatas.length){
for(let i=0;i<dataList.value.length;i++){
let x = dataList.value[i]
let findObj = datas.SelectedDatas.find(y=> y==x.DetailsId)
let findObj = datas.SelectedDatas.find(y=> y.DetailsId==x.DetailsId)
if(findObj) dataList.value[i].check = true
}
datas.indeterminate = true
......@@ -416,6 +530,7 @@
const MultipleChoice = (row:Array) =>{
datas.SelectedDatas = row
datas.IdList = row.map(x=>{ return x.DetailsId})
if(datas.SelectedDatas.length>0) datas.ControlsShow = true
newDatasSelected()
}
......@@ -425,13 +540,13 @@
datas.SelectedDatas = []
for(let i=0;i<dataList.value.length;i++){
dataList.value[i].check = true
datas.SelectedDatas.push(dataList.value[i].DetailsId)
datas.SelectedDatas.push(dataList.value[i])
}
datas.indeterminate = false
}else if(datas.indeterminate){
datas.SelectedDatas.forEach(x=>{
dataList.value.forEach(y=>{
if(x==y.DetailsId) y.check = true
if(x.DetailsId==y.DetailsId) y.check = true
})
})
}else{
......@@ -441,6 +556,7 @@
datas.SelectedDatas = []
datas.indeterminate = false
}
if(datas.SelectedDatas.length>0) datas.IdList = datas.SelectedDatas.map(x=>{ return x.DetailsId})
}
const getDate = () => {
......@@ -474,15 +590,20 @@
refreshHandler()
}
if(type==3){
loading.value = true
const loadingObj = ElLoading.service({
text:'正在切换',
lock:true
})
layoutType.value.forEach(x=>{
if(x.ID!=item.ID) x.check = false
})
item.check = true
queryObj.layout = item.ID
let time = 300
if(dataList.value.length>50) time = 3000
setTimeout(()=>{
loading.value = false
},3000)
loadingObj.close()
},time)
}
}
......@@ -547,10 +668,11 @@ const deleteImg = (item:any) => {
try {
loading.value = true
let dataRes = await CloudDiskService.RemovePPTCloudInfo(item.DetailsId)
loading.value = false
if (dataRes.data.resultCode==ApiResult.SUCCESS) {
querySearchHandler()
refreshHandler()
}
loading.value = false
} catch (error) {}
}).catch(() => {})
......@@ -705,12 +827,10 @@ const SearchImg = () =>{
if(queryObj.FileName=='') refreshHandler()
}
const refreshHandler = (row:any) => {
// currentRootDom.value.click()
if(row&&row.Id) {
if(row&&(row.Id||row.Id=='')) {
if(row.Id==queryObj.CloudGroupId) return
queryObj.CloudGroupId = row.Id
datas.selectAll = false
datas.indeterminate = false
ClearOption()
}
RefreshLoading.value = true;
queryObj.pageIndex = 1;
......@@ -764,6 +884,7 @@ const SearchImg = () =>{
}
querySearchGroup()
querySearchHandler()
getCloudInfo()
onMounted(()=>{
document.addEventListener('click', (e) => {
if (currentSearchType.value==3) {
......@@ -898,10 +1019,10 @@ onMounted(()=>{
margin-top: 13px;
}
.CloudDisk-R-Plus span{
// font-family: PingFang SC;
/* font-family: PingFang SC; */
font-weight: 400;
font-size: 14px;
// color: #CECECE;
/* color: #CECECE; */
}
.CloudDisk-L-Center{
height: 95%;
......@@ -910,7 +1031,8 @@ onMounted(()=>{
.CloudDisk-RBF{
position: fixed;
bottom: 10px;
left: 515px;
/* 515px */
left: 0;
right: 0;
z-index: 2;
}
......
src/components/CloudDisk/cellList.vue
View file @ d4879fe4
......@@ -86,12 +86,12 @@
const multipleSelection = ref([] as any)
const handleSelectionChange = (row: any) =>{
let filter = props.Parent.SelectedDatas.filter(x=>x==row.DetailsId)
let filter = props.Parent.SelectedDatas.filter(x=>x.DetailsId==row.DetailsId)
if(filter.length==0&&row.check) {
multipleSelection.value.push(row.DetailsId)
multipleSelection.value.push(row)
emit('MultipleChoice',multipleSelection.value)
}else if(!row.check){
let newFilter = props.Parent.SelectedDatas.filter(x=>x!=row.DetailsId)
let newFilter = props.Parent.SelectedDatas.filter(x=>x.DetailsId!=row.DetailsId)
multipleSelection.value = newFilter
emit('MultipleChoice',multipleSelection.value)
}
......
src/components/CloudDisk/copyMove.vue
View file @ d4879fe4
......@@ -43,8 +43,8 @@
required: true,
},
DetailsId: {
type: String,
required: '',
type: String||Array,
required: ''||[],
},
GroupId: {
type: String,
......@@ -67,7 +67,7 @@
dialogTitle.value = props.dialogType==1?'复制文件':'移动文件'
const getGName = () =>{
let GroupArr = GroupList.value.filter(x=>x.Id==params.GId)
let GroupArr = props.GroupList.filter(x=>x.Id==params.GId)
currentGroup.value = GroupArr[0].GName
}
const close = () =>{
......@@ -75,7 +75,9 @@
emit('close')
}
const submit = () => {
if(!Array.isArray(props.DetailsId)){
params.Id = props.DetailsId
}
let text = ''
if(props.dialogType==1)text = `复制到${currentGroup.value}分组下`
else text = `移动至${currentGroup.value}分组下`
......@@ -88,9 +90,22 @@
type: 'warning',
}
).then(() => {
setCopy()
if(!Array.isArray(props.DetailsId))setCopy()
else BatchCopy()
}).catch(() => {})
}
const BatchCopy = async () =>{
setLoading.value = true
let response;
if(props.dialogType==1) response = await CloudDiskService.BatchCloudFileCopy(props.DetailsId,params.GId);
else response = await CloudDiskService.BatchCloudFileMove(props.DetailsId,params.GId);
if (response.data.resultCode==ApiResult.SUCCESS) {
dialogFormVisible.value = false
emit('success',1)
}
setLoading.value = false
}
const setCopy = async () =>{
setLoading.value = true
let response;
......
src/components/CloudDisk/list.vue
View file @ d4879fe4
......@@ -5,19 +5,15 @@
@selection-change="handleSelectionChange"
row-key="DetailsId">
<el-table-column type="selection" width="55"/>
<el-table-column label="基本信息" show-overflow-tooltip min-width="200">
<el-table-column label="基本信息" show-overflow-tooltip min-width="400">
<template #default="scope">
<div class="row items-center">
<el-image
class="cursor-pointer"
style="width: 50px; height: auto"
:src="scope.row.FilePath"
:zoom-rate="1.2"
:max-scale="7"
:min-scale="0.2"
:preview-src-list="[]"
:initial-index="4"
fit="contain"
fit=""
@click="getImg(scope.row,scope.$index)"
>
<template #error>
......@@ -48,15 +44,18 @@
<el-table-column label="大小" min-width="100">
<template #default="scope">{{ scope.row.FileSize }} kb</template>
</el-table-column>
<el-table-column label="添加时间" min-width="180">
<template #default="scope">{{ scope.row.CreateDate }}</template>
</el-table-column>
<el-table-column align="center" min-width="80">
<template #header>
<el-dropdown trigger="click" >
<el-icon class="cursor-pointer" size="16" color="#b1b7cf"><IconSetting /></el-icon>
<template #dropdown>
<el-dropdown-menu class="q-pa-md microsoft">
<el-dropdown-item icon="CopyDocument" @click="CopyTo()">复制到</el-dropdown-item>
<el-dropdown-item icon="Expand" @click="MoveFile()">移动到</el-dropdown-item>
<el-dropdown-item icon="Delete" @click="deleteImg()">删除</el-dropdown-item>
<el-dropdown-item icon="CopyDocument" @click="BatchCopyTo()">复制到</el-dropdown-item>
<el-dropdown-item icon="Expand" @click="BatchMoveFile()">移动到</el-dropdown-item>
<el-dropdown-item icon="Delete" @click="BatchRemove()">删除</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
......@@ -106,6 +105,9 @@
(event: 'getImg'): void,
(event: 'deleteImg'): void,
(event: 'MultipleChoice'): void,
(event: 'BatchRemove'): void,
(event: 'BatchCopyTo'): void,
(event: 'BatchMoveFile'): void,
}>()
const editorTarget = ref('')
const nickNam = ref(''|| Number)
......@@ -114,8 +116,20 @@
const multipleTableRef = ref<InstanceType<typeof ElTable>>()
const multipleSelection = ref([] as any)
const BatchRemove = () =>{
emit('BatchRemove')
}
const BatchCopyTo = () =>{
emit('BatchCopyTo')
}
const BatchMoveFile = () =>{
emit('BatchMoveFile')
}
const handleSelectionChange = (val: []) =>{
multipleSelection.value = val.map(x=>{return x.DetailsId})
multipleSelection.value = val.map(x=>{return x})
emit('MultipleChoice',multipleSelection.value)
}
const setCloudNameHandler = async (target:any)=>{
......@@ -174,7 +188,7 @@
props.Parent.SelectedDatas.forEach(x => {
let filterS = props.dataList.filter((y,index)=>{
y.index=index
return x==y.DetailsId
return x.DetailsId==y.DetailsId
})
let index = filterS&&filterS[0]&&filterS[0].index
if(index>=0) {
......
src/components/CloudDisk/waterfallFlowList.vue
View file @ d4879fe4
......@@ -105,12 +105,12 @@
const multipleSelection = ref([] as any)
const handleSelectionChange = (row: any) =>{
let filter = props.Parent.SelectedDatas.filter(x=>x==row.DetailsId)
let filter = props.Parent.SelectedDatas.filter(x=>x.DetailsId==row.DetailsId)
if(filter.length==0&&row.check) {
multipleSelection.value.push(row.DetailsId)
multipleSelection.value.push(row)
emit('MultipleChoice',multipleSelection.value)
}else if(!row.check){
let newFilter = props.Parent.SelectedDatas.filter(x=>x!=row.DetailsId)
let newFilter = props.Parent.SelectedDatas.filter(x=>x.DetailsId!=row.DetailsId)
multipleSelection.value = newFilter
emit('MultipleChoice',multipleSelection.value)
}
......
src/services/CloudDiskService.ts
View file @ d4879fe4
......@@ -4,6 +4,21 @@ import Api,{ HttpResponse, Result } from './../utils/request';
class CloudDiskService{
static async GetEmpByEmpNameKey(keyWord:string):Promise<HttpResponse>{
let params = {keyWord}
return Api.Post("ppt_GetEmpByEmpNameKey",params)
}
static async BatchCloudFileCopy(IdList:any,GId:string):Promise<HttpResponse>{
let params = {IdList,GId}
return Api.Post("ppt_BatchCloudFileCopy",params)
}
static async BatchCloudFileMove(IdList:any,GId:string):Promise<HttpResponse>{
let params = {IdList,GId}
return Api.Post("ppt_BatchCloudFileMove",params)
}
static async BatchRemoveCloudInfo(IdList:any):Promise<HttpResponse>{
let params = {IdList}
return Api.Post("ppt_BatchRemoveCloudInfo",params)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment