tcjlj/PicList
1
0
Fork 0
mirror of https://github.com/Kuingsmile/PicList.git synced 2025-02-09 13:58:12 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updated: trayPage add img-list object-fit

Browse Source
This commit is contained in:
zWingz 2019-03-16 09:58:23 +08:00 committed by PiEgg
parent 058e903789
commit 69d660fe7e
1 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/renderer/pages/TrayPage.vue
View File

@ -4,7 +4,7 @@
<div class="content"> <div class="content">
<div class="wait-upload-img" v-if="clipboardFiles.length > 0"> <div class="wait-upload-img" v-if="clipboardFiles.length > 0">
<div class="list-title">等待上传</div> <div class="list-title">等待上传</div>
<div v-for="(item, index) in clipboardFiles" :key="index" class="img-list" :style="{height: calcHeight(item.width, item.height) + 'px'}"> <div v-for="(item, index) in clipboardFiles" :key="index" class="img-list">
<div <div
class="upload-img__container" class="upload-img__container"
:class="{ upload: uploadFlag }" :class="{ upload: uploadFlag }"
@ -15,7 +15,7 @@
</div> </div>
<div class="uploaded-img"> <div class="uploaded-img">
<div class="list-title">已上传</div> <div class="list-title">已上传</div>
<div v-for="item in files" :key="item.imgUrl" class="img-list" :style="{height: calcHeight(item.width, item.height) + 'px'}"> <div v-for="item in files" :key="item.imgUrl" class="img-list">
<div class="upload-img__container" @click="copyTheLink(item)"> <div class="upload-img__container" @click="copyTheLink(item)">
<img :src="item.imgUrl" class="upload-img"> <img :src="item.imgUrl" class="upload-img">
</div> </div>
@ -62,6 +62,7 @@
}) })
this.$electron.ipcRenderer.on('uploadFiles', (event) => { this.$electron.ipcRenderer.on('uploadFiles', (event) => {
this.files = this.$db.read().get('uploaded').slice().reverse().slice(0, 5).value() this.files = this.$db.read().get('uploaded').slice().reverse().slice(0, 5).value()
console.log(this.files)
this.uploadFlag = false this.uploadFlag = false
}) })
this.$electron.ipcRenderer.on('updateFiles', (event) => { this.$electron.ipcRenderer.on('updateFiles', (event) => {
@ -146,11 +147,11 @@ body::-webkit-scrollbar
top 0px top 0px
width 100% width 100%
.img-list .img-list
padding 16px 8px padding 8px 8px
display flex display flex
justify-content space-between justify-content space-between
align-items center align-items center
height 45px // height 45px
cursor pointer cursor pointer
transition all .2s ease-in-out transition all .2s ease-in-out
&:hover &:hover
@ -158,8 +159,8 @@ body::-webkit-scrollbar
.upload-img__index .upload-img__index
color #fff color #fff
.upload-img .upload-img
height 100%
width 100% width 100%
object-fit scale-down
margin 0 auto margin 0 auto
&__container &__container
width 100% width 100%