From ae6d20ec4a30b7e796feb05958bcfc80e55f247b Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期四, 20 七月 2023 15:21:45 +0800
Subject: [PATCH] 整合代码部署
---
Source/UBCS-WEB/dist/src/components/basic-block/main.vue | 126 ++++++++++++++++++++++++++++++++++++++++++
1 files changed, 126 insertions(+), 0 deletions(-)
diff --git a/Source/UBCS-WEB/dist/src/components/basic-block/main.vue b/Source/UBCS-WEB/dist/src/components/basic-block/main.vue
new file mode 100644
index 0000000..b7c5f64
--- /dev/null
+++ b/Source/UBCS-WEB/dist/src/components/basic-block/main.vue
@@ -0,0 +1,126 @@
+<template>
+ <div class="basic-block"
+ :style="styleName">
+ <div class="box"
+ :style="boxStyleName">
+ <router-link :to="to">
+ <span v-text="text"></span>
+ <p v-text="dept"></p>
+ <i :class="icon"></i>
+ </router-link>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'basicBlock',
+ props: {
+ icon: {
+ type: String,
+ },
+ background: {
+ type: String,
+ },
+ to: {
+ type: Object,
+ default: () => {
+ return {}
+ }
+ },
+ text: {
+ type: String,
+ },
+ dept: {
+ type: String,
+ },
+ time: {
+ type: [Number, String]
+ },
+ gutter: {
+ type: [Number, String],
+ default: 5,
+ },
+ color: {
+ type: String,
+ },
+ width: {
+ type: [Number, String]
+ },
+ height: {
+ type: [Number, String]
+ }
+ },
+ computed: {
+ styleName () {
+ return {
+ animationDelay: `${this.time / 25}s`,
+ width: this.setPx(this.width),
+ height: this.setPx(this.height),
+ margin: this.setPx(this.gutter)
+ }
+ },
+ boxStyleName () {
+ return {
+ backgroundColor: this.color,
+ backgroundImage: `url('${this.background}')`,
+
+ }
+
+ }
+ }
+}
+</script>
+
+<style lang="scss">
+.basic-block {
+ opacity: 0;
+
+ box-sizing: border-box;
+ color: #fff;
+ animation: mymove 1s;
+ animation-fill-mode: forwards;
+ .box {
+ position: relative;
+ box-sizing: border-box;
+ padding: 15px;
+ width: 100%;
+ height: 100%;
+ transition: all 1s;
+ background-size: cover;
+ &:hover {
+ transform: rotateY(360deg);
+ }
+ }
+
+ a {
+ color: #fff;
+ }
+ span {
+ display: block;
+ font-size: 16px;
+ }
+ p {
+ width: 80%;
+ font-size: 10px;
+ color: #eee;
+ line-height: 22px;
+ }
+ i {
+ position: absolute;
+ bottom: 15px;
+ right: 15px;
+ font-size: 50px !important ;
+ }
+ @keyframes mymove {
+ from {
+ opacity: 0;
+ transform: scale(0);
+ }
+ to {
+ opacity: 1;
+ transform: scale(1);
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3