add 查看详情添加加载动画

This commit is contained in:
SummerTail 2023-07-07 16:56:27 +08:00
parent f22aa6d64a
commit 3adfce7781

View File

@ -3,7 +3,7 @@
<div> <div>
<div class="list"> <div class="list">
<div class="item" v-for="i in list"> <div class="item" v-for="i in list">
<el-card :body-style="{ padding: '0px' }"> <el-card @click="getInfo(i.id)" shadow="hover" :body-style="{ padding: '0px' }">
<img :src="i.img" class="image"/> <img :src="i.img" class="image"/>
<div style="padding: 14px"> <div style="padding: 14px">
<span>{{ i.title }}({{ i.year }})</span> <span>{{ i.title }}({{ i.year }})</span>
@ -33,6 +33,7 @@
import {ref} from 'vue'; import {ref} from 'vue';
import {getVideoInfo, searchVideo} from '../../api/Video.js' import {getVideoInfo, searchVideo} from '../../api/Video.js'
import {onBeforeRouteUpdate, useRoute} from "vue-router"; import {onBeforeRouteUpdate, useRoute} from "vue-router";
import {ElLoading} from "element-plus";
let list = ref([]) let list = ref([])
const info = ref("") const info = ref("")
@ -53,12 +54,17 @@ onBeforeRouteUpdate(next => {
let vid = ""; let vid = "";
const dialogFormVisible = ref(false) const dialogFormVisible = ref(false)
async function getInfo(id) { async function getInfo(id) {
const loadingInstance = ElLoading.service({fullscreen: true})
vid = id vid = id
let res = await getVideoInfo(id) let res = await getVideoInfo(id)
info.value = res.data.format info.value = res.data.format
dialogFormVisible.value = true dialogFormVisible.value = true
loadingInstance.close()
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>