Commit ec1962bf authored by zhengke's avatar zhengke

优化 列表组件

parent 4701d21a
<template> <template>
<div class="q-px-md q-pt-lg"> <div class="q-px-md q-pt-lg column full-height">
<div class="q-pl-lg row q-mb-lg"> <div class="q-pl-lg row q-mb-lg">
<div class="col row items-center q-pl-md"> <div class="col row items-center q-pl-md">
<h5 class="row items-center"> <h5 class="row items-center">
...@@ -47,45 +47,19 @@ ...@@ -47,45 +47,19 @@
</el-dropdown> --> </el-dropdown> -->
</div> </div>
</div> </div>
</div> <div ref="SellTemplateRef" class="col full-width q-ml-md">
<div
ref="SellTemplateRef"
class="journeyAds-container"
style="height: 100%; overflow: auto"
>
<el-scrollbar @scroll="scrollingHandler" class="q-px-md" style="height: 100%;">
<journeyAdsList <journeyAdsList
:current-menu="currentMenu" :current-menu="currentMenu"
:list="dataList" :position="position"
:msg="queryObj" :set-file-list="datas.setFileList"
@UpdateData="UpdateData" :list="dataList"
@success="success" :msg="queryObj"
@refreshHandler="refreshHandler"></journeyAdsList> :navigations="Navigations"
<div :selected-datas="datas.selectedDatas"
v-if="dataList.length == 0 && !loading" @UpdateData="UpdateData"
class="q-mt-lg bg-white rounded" @success="success"
style="padding: 30px 10px 30px 10px" @refreshHandler="refreshHandler"></journeyAdsList>
>
<el-empty description="暂无数据" />
</div> </div>
<el-divider
class="no-bg q-mt-lg"
v-if="queryObj.pageCount == queryObj.pageIndex && !loading && queryObj.pageCount != 1"
>
<span
class="text-small bg-white"
style="padding: 0 10px; color: #a3a3a3"
>已加载完成所有数据</span
>
</el-divider>
<div
style="height: 40px"
class="q-mt-md no-bg"
background="transparent"
v-loading="loading"
element-loading-text="正在加载中"
></div>
</el-scrollbar>
</div> </div>
</template> </template>
......
<template> <template>
<div class="q-px-md q-pt-lg"> <div class="q-px-md q-pt-lg column full-height">
<div class="q-pl-lg row q-mb-lg"> <div class="q-pl-lg row q-mb-lg">
<div class="col row items-center q-pl-md"> <div class="col row items-center q-pl-md">
<h5 class="row items-center"> <h5 class="row items-center">
...@@ -30,51 +30,22 @@ ...@@ -30,51 +30,22 @@
</div> </div>
</div> </div>
</div> <div ref="SellTemplateRef" class="col full-width q-ml-md">
<div
ref="SellTemplateRef"
class="journeyAds-container"
style="height: 100%; overflow: auto"
>
<el-scrollbar @scroll="scrollingHandler" class="q-px-md" style="height: 100%;">
<journeyAdsList <journeyAdsList
:current-menu="currentMenu" :current-menu="currentMenu"
:position="position" :position="position"
:set-file-list="datas.setFileList" :set-file-list="datas.setFileList"
:list="dataList" :list="dataList"
:msg="queryObj" :msg="queryObj"
:navigations="Navigations" :navigations="Navigations"
:selected-datas="datas.selectedDatas" :selected-datas="datas.selectedDatas"
@UpdateData="UpdateData" @UpdateData="UpdateData"
@success="success" @success="success"
@refreshHandler="refreshHandler"></journeyAdsList> @refreshHandler="refreshHandler"></journeyAdsList>
<div
v-if="dataList.length == 0 && !loading"
class="q-mt-lg bg-white rounded"
style="padding: 30px 10px 30px 10px"
>
<el-empty description="暂无数据" />
</div> </div>
<el-divider
class="no-bg q-mt-lg"
v-if="queryObj.pageCount == queryObj.pageIndex && !loading && queryObj.pageCount != 1"
>
<span
class="text-small bg-white"
style="padding: 0 10px; color: #a3a3a3"
>已加载完成所有数据</span
>
</el-divider>
<div
style="height: 40px"
class="q-mt-md no-bg"
background="transparent"
v-loading="loading"
element-loading-text="正在加载中"
></div>
</el-scrollbar>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, reactive, provide, watch, inject, onMounted, PropType } from "vue"; import { ref, reactive, provide, watch, inject, onMounted, PropType } from "vue";
......
<template> <template>
<div class="q-px-md q-pt-lg"> <div class="q-px-md q-pt-lg column full-height">
<div class="q-pl-lg row q-mb-lg"> <div class="q-pl-lg row q-mb-lg">
<div class="col row items-center q-pl-md"> <div class="col row items-center q-pl-md">
<h5 class="row items-center"> <h5 class="row items-center">
...@@ -52,49 +52,19 @@ ...@@ -52,49 +52,19 @@
</el-dropdown> --> </el-dropdown> -->
</div> </div>
</div> </div>
</div> <div ref="SellTemplateRef" class="col full-width q-ml-md">
<div
ref="SellTemplateRef"
class="journeyAds-container"
style="height: 100%; overflow: auto"
>
<el-scrollbar @scroll="scrollingHandler" class="q-px-md" style="height: 100%;">
<journeyAdsList <journeyAdsList
:current-menu="currentMenu" :current-menu="currentMenu"
:position="position" :position="position"
:set-file-list="datas.setFileList" :set-file-list="datas.setFileList"
:list="dataList" :list="dataList"
:msg="queryObj" :msg="queryObj"
:navigations="Navigations" :navigations="Navigations"
:selected-datas="datas.selectedDatas" :selected-datas="datas.selectedDatas"
@UpdateData="UpdateData" @UpdateData="UpdateData"
@success="success" @success="success"
@refreshHandler="refreshHandler"></journeyAdsList> @refreshHandler="refreshHandler"></journeyAdsList>
<div
v-if="dataList.length == 0 && !loading"
class="q-mt-lg bg-white rounded"
style="padding: 30px 10px 30px 10px"
>
<el-empty description="暂无数据" />
</div> </div>
<el-divider
class="no-bg q-mt-lg"
v-if="queryObj.pageCount == queryObj.pageIndex && !loading && queryObj.pageCount != 1"
>
<span
class="text-small bg-white"
style="padding: 0 10px; color: #a3a3a3"
>已加载完成所有数据</span
>
</el-divider>
<div
style="height: 40px"
class="q-mt-md no-bg"
background="transparent"
v-loading="loading"
element-loading-text="正在加载中"
></div>
</el-scrollbar>
</div> </div>
<Folder <Folder
:folder-id="folderObj?.id" :folder-id="folderObj?.id"
......
<template> <template>
<div style="min-width: '700px';height: 100%;" ref="currentRootDom"> <el-table ref="currentRootDom" class="sample-table" :data="dataList" style="width: 100%" height="100%"
<el-table class="sample-table" :data="dataList" style="width: 100%" height="100%"
@sort-change="sortHandler" :default-sort="{ prop: 'CreateTime', order: 'descending' }" @sort-change="sortHandler" :default-sort="{ prop: 'CreateTime', order: 'descending' }"
@selection-change="handleSelectionChange"> @selection-change="handleSelectionChange">
<el-table-column type="selection" width="20" v-if="currentMenu==3||currentMenu==4"/> <el-table-column type="selection" width="20" v-if="currentMenu==3||currentMenu==4"/>
...@@ -29,9 +28,11 @@ ...@@ -29,9 +28,11 @@
</template> </template>
<template #default="scope"> <template #default="scope">
<div class="row items-center full-width" style="padding-left: 12px;"> <div class="row items-center full-width" style="padding-left: 12px;">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708337830000_43.png" height="25" v-if="scope.row.FileType==1" @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"/> <div :class="{'share-icon-box':scope.row.IsShare}" style="display: inline-block;">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708250377000_777.png" height="25" v-else-if="scope.row.FileType==2" @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"/> <img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708337830000_43.png" height="25" v-if="scope.row.FileType==1" @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"/>
<img src="@/assets/img/file.png" height="25" v-else @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"/> <img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708250377000_777.png" height="25" v-else-if="scope.row.FileType==2" @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"/>
<img src="@/assets/img/file.png" height="25" v-else @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"/>
</div>
<div class="temp-tr col q-ml-md file-name" :class="{'cusor-pointer':scope.row.FileType==0}"> <div class="temp-tr col q-ml-md file-name" :class="{'cusor-pointer':scope.row.FileType==0}">
<el-tooltip v-if="!scope.row.editTitle" effect="dark" :content="scope.row.FileName"> <el-tooltip v-if="!scope.row.editTitle" effect="dark" :content="scope.row.FileName">
<div @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)"> <div @click.stop="scope.row.FileType?OffEdit():editDelete(scope.row,2)">
...@@ -104,10 +105,9 @@ ...@@ -104,10 +105,9 @@
</el-table-column> </el-table-column>
<template #empty> <template #empty>
<el-empty :image-size="150" v-if="(!dataList || dataList.length==0) && !loading" <el-empty :image-size="150" v-if="(!dataList || dataList.length==0) && !loading"
:description="(queryObj.FileId==0?'没有文档':'文件夹里没有文件')" /> :description="(queryObj.FileId==0?'没有文档':currentMenu!=-1?'文件夹里没有文件':'没有文件')" />
</template> </template>
</el-table> </el-table>
</div>
<ShareForm <ShareForm
:id="shareId" :id="shareId"
:file-type="shareFileType" :file-type="shareFileType"
...@@ -672,4 +672,18 @@ import CopyFile from "./CopyFile.vue"; ...@@ -672,4 +672,18 @@ import CopyFile from "./CopyFile.vue";
/* .sample-table th:nth-child(2) .cell{ /* .sample-table th:nth-child(2) .cell{
padding-left: 0 !important; padding-left: 0 !important;
} */ } */
.share-icon-box{
position: relative;
}
.share-icon-box::after{
display: block;
position: absolute;
bottom: -4px;
right: 0px;
content: " ";
background: url('@/assets/img/share.png');
width: 14px;
height: 14px;
z-index: 2;
}
</style> </style>
\ No newline at end of file
<template> <template>
<div class="q-px-md q-pt-lg"> <div class="q-px-md q-pt-lg column full-height">
<div class="q-pl-lg row q-mb-lg"> <div class="q-pl-lg row q-mb-lg">
<div class="col row items-center q-pl-md"> <div class="col row items-center q-pl-md">
<h5 class="row items-center"> <h5 class="row items-center">
...@@ -63,51 +63,28 @@ ...@@ -63,51 +63,28 @@
</el-dropdown> </el-dropdown>
</div> </div>
</div> </div>
<!--
<div
ref="SellTemplateRef"
class="journeyAds-container" v-if="false">
<el-scrollbar @scroll="scrollingHandler" class="q-px-md" style="height: 100%;">
</el-scrollbar>
</div> -->
<div ref="SellTemplateRef" class="col full-width q-ml-md">
<journeyAdsList
:current-menu="currentMenu"
:position="position"
:set-file-list="datas.setFileList"
:list="dataList"
:msg="queryObj"
:navigations="Navigations"
:selected-datas="datas.selectedDatas"
@UpdateData="UpdateData"
@success="success"
@refreshHandler="refreshHandler"></journeyAdsList>
</div>
</div> </div>
<div
ref="SellTemplateRef"
class="journeyAds-container"
style="height: 100%; overflow: auto"
>
<el-scrollbar @scroll="scrollingHandler" class="q-px-md" style="height: 100%;">
<journeyAdsList
:current-menu="currentMenu"
:position="position"
:set-file-list="datas.setFileList"
:list="dataList"
:msg="queryObj"
:navigations="Navigations"
:selected-datas="datas.selectedDatas"
@UpdateData="UpdateData"
@success="success"
@refreshHandler="refreshHandler"></journeyAdsList>
<!--
<div
v-if="dataList.length == 0 && !loading"
class="q-mt-lg bg-white rounded"
style="padding: 30px 10px 30px 10px"
>
<el-empty description="暂无数据" />
</div>
<el-divider
class="no-bg q-mt-lg"
v-if="queryObj.pageCount == queryObj.pageIndex && !loading && queryObj.pageCount != 1"
>
<span
class="text-small bg-white"
style="padding: 0 10px; color: #a3a3a3"
>已加载完成所有数据</span
>
</el-divider>
<div
style="height: 40px"
class="q-mt-md no-bg"
background="transparent"
v-loading="loading"
element-loading-text="正在加载中"
></div> -->
</el-scrollbar>
</div>
<Folder <Folder
:folder-id="folderObj?.id" :folder-id="folderObj?.id"
:folder-name="folderObj?.name" :folder-name="folderObj?.name"
...@@ -365,86 +342,5 @@ querySearchHandler(); ...@@ -365,86 +342,5 @@ querySearchHandler();
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import url("@/assets/styles/common.css");
.SelectAllBox {
position: relative;
top: 3px;
}
.journeyAds-title {
}
.journeyAds-TitleCenter {
width: 100%;
height: 18px;
margin-bottom: 3px;
overflow: hidden; /* 隐藏超出部分 */
text-overflow: ellipsis; /* 显示省略号 */
white-space: wrap; /* 不换行 */
position: relative;
padding-right: 20px;
}
.journeyAds-TitleCenter span {
position: absolute;
right: 16px;
top: 0px;
}
.journeyAds-Input {
padding-right: 20px;
position: relative;
margin-bottom: 2px;
::v-deep(.el-textarea__inner) {
padding: 5px;
background: #f5f5f5;
}
}
.journeyAds-container {
position: relative;
overflow: auto;
}
.journeyAds-container th {
background: #fff;
position: sticky;
top: 0px;
z-index: 2;
}
.journeyAdsple-table td > div {
display: flex;
}
.journeyAdsple-table td,
.journeyAds-container th {
border-bottom: 1px solid #f6f6f6;
}
.journeyAdsple-table td:first-child,
.journeyAdsple-table td:nth-child(2),
.journeyAds-container th:first-child {
border: 0;
}
.journeyAdsple-table td {
padding-bottom: 6px;
}
.journeyAdsple-table td:nth-child(2) {
padding-bottom: 0;
}
.hoverShow {
opacity: 0;
}
.journeyAdsple-table:hover .hoverShow {
opacity: 1;
}
.share-icon-box{
position: relative;
}
.share-icon-box::after{
display: block;
position: absolute;
bottom: -4px;
right: 6px;
content: " ";
background: url('@/assets/img/share.png');
width: 14px;
height: 14px;
z-index: 2;
}
.active {
color: $themeColor;
}
</style> </style>
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