frame: add local flag to photo
Signed-off-by: Varun Patil <radialapps@gmail.com>pull/653/head
parent
917fccf0da
commit
839de2e646
|
@ -9,20 +9,21 @@
|
||||||
error: data.flag & c.FLAG_LOAD_FAIL,
|
error: data.flag & c.FLAG_LOAD_FAIL,
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<CheckCircle v-once :size="18" class="select" @click="toggleSelect" />
|
<CheckCircleIcon v-once :size="18" class="select" @click="toggleSelect" />
|
||||||
|
|
||||||
<div class="video" v-if="data.flag & c.FLAG_IS_VIDEO">
|
<div class="video" v-if="data.flag & c.FLAG_IS_VIDEO">
|
||||||
<span v-if="data.video_duration" class="time">
|
<span v-if="data.video_duration" class="time">
|
||||||
{{ videoDuration }}
|
{{ videoDuration }}
|
||||||
</span>
|
</span>
|
||||||
<Video :size="22" />
|
<VideoIcon :size="22" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="livephoto" @mouseenter.passive="playVideo" @mouseleave.passive="stopVideo">
|
<div class="livephoto" @mouseenter.passive="playVideo" @mouseleave.passive="stopVideo">
|
||||||
<LivePhoto :size="22" v-if="data.liveid" />
|
<LivePhotoIcon :size="22" v-if="data.liveid" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Star :size="22" v-if="data.flag & c.FLAG_IS_FAVORITE" />
|
<StarIcon class="bottom-left-flag" :size="22" v-if="data.flag & c.FLAG_IS_FAVORITE" />
|
||||||
|
<LocalIcon class="bottom-left-flag" :size="22" v-if="data.flag & c.FLAG_IS_LOCAL" />
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="img-outer fill-block"
|
class="img-outer fill-block"
|
||||||
|
@ -60,18 +61,20 @@ import { IDay, IPhoto } from '../../types';
|
||||||
import * as utils from '../../services/Utils';
|
import * as utils from '../../services/Utils';
|
||||||
|
|
||||||
import errorsvg from '../../assets/error.svg';
|
import errorsvg from '../../assets/error.svg';
|
||||||
import CheckCircle from 'vue-material-design-icons/CheckCircle.vue';
|
import CheckCircleIcon from 'vue-material-design-icons/CheckCircle.vue';
|
||||||
import Star from 'vue-material-design-icons/Star.vue';
|
import StarIcon from 'vue-material-design-icons/Star.vue';
|
||||||
import Video from 'vue-material-design-icons/PlayCircleOutline.vue';
|
import VideoIcon from 'vue-material-design-icons/PlayCircleOutline.vue';
|
||||||
import LivePhoto from 'vue-material-design-icons/MotionPlayOutline.vue';
|
import LivePhotoIcon from 'vue-material-design-icons/MotionPlayOutline.vue';
|
||||||
|
import LocalIcon from 'vue-material-design-icons/CloudOff.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'Photo',
|
name: 'Photo',
|
||||||
components: {
|
components: {
|
||||||
CheckCircle,
|
CheckCircleIcon,
|
||||||
Video,
|
VideoIcon,
|
||||||
Star,
|
StarIcon,
|
||||||
LivePhoto,
|
LivePhotoIcon,
|
||||||
|
LocalIcon,
|
||||||
},
|
},
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
|
@ -323,7 +326,7 @@ $icon-size: $icon-half-size * 2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.video,
|
.video,
|
||||||
.star-icon,
|
.bottom-left-flag,
|
||||||
.livephoto {
|
.livephoto {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
|
@ -353,7 +356,7 @@ $icon-size: $icon-half-size * 2;
|
||||||
.livephoto {
|
.livephoto {
|
||||||
pointer-events: auto;
|
pointer-events: auto;
|
||||||
}
|
}
|
||||||
.star-icon {
|
.bottom-left-flag {
|
||||||
bottom: var(--icon-dist);
|
bottom: var(--icon-dist);
|
||||||
left: var(--icon-dist);
|
left: var(--icon-dist);
|
||||||
.p-outer.selected > & {
|
.p-outer.selected > & {
|
||||||
|
|
Loading…
Reference in New Issue