From 1ccf273669781c817bbc9a03913a308e83fe16a7 Mon Sep 17 00:00:00 2001 From: xy <271556543@qq.com> Date: Mon, 26 Jun 2023 21:19:39 +0800 Subject: [PATCH] 2022.6.26 --- App.vue | 43 +++++ common/http.api.js | 8 +- common/util.js | 31 ++++ lib/html2canvas.min.js | 20 +++ manifest.json | 2 +- package.json | 22 +++ pages/certificate/certificate.vue | 256 +++++++++++++++++++++++++++++- static/toShare.png | Bin 0 -> 4688 bytes 8 files changed, 375 insertions(+), 7 deletions(-) create mode 100644 lib/html2canvas.min.js create mode 100644 package.json create mode 100644 static/toShare.png diff --git a/App.vue b/App.vue index 7c86708..69f1c1c 100644 --- a/App.vue +++ b/App.vue @@ -1,4 +1,5 @@ @@ -95,7 +219,7 @@ export default { } } -.share { +.share-img { animation: jello-horizontal 3.2s both infinite; position: fixed; @@ -196,4 +320,128 @@ export default { } } } + +.share_cover { + background: rgba(0, 0, 0, 0.8); + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + height: 100vh; + width: 100vw; + z-index: 100000; + + .share_cover_word { + color: #FFFFFF; + font-size: 48rpx; + width: 60%; + margin: 400rpx auto; + text-align: center; + line-height: 40px; + + } + + .share_cover_arrow { + position: absolute; + right: 0; + top: 0; + width: 300rpx; + height: 400rpx; + } +} +.share { + min-height: 100vh; + overflow-y: scroll; + + padding: 278rpx 0; + z-index: 2; + position: fixed; + top: 0; + left: 0; + right: 0; + + &-mask { + background: rgba(0, 0, 0, 0.4); + + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + } + + &-page { + width: fit-content; + overflow: scroll; + + transform: translate(-50%, -50%); + position: absolute; + top: 50%; + left: 50%; + right: 0; + + &>image { + width: 520rpx; + height: auto; + display: block; + border: 6rpx solid #F8E3CF; + box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(19, 1, 2, 0.71); + + margin: auto; + } + + &__btn { + display: flex; + justify-content: center; + + padding-top: 52rpx; + + &>view { + width: 230rpx; + height: 66rpx; + background: linear-gradient(0deg, #EFC495, #E9BC8A); + border-radius: 34rpx; + text-align: center; + font-weight: 400; + line-height: 66rpx; + font-size: 26rpx; + letter-spacing: 8rpx; + color: #C93E31; + } + + &--share { + + margin-right: 60rpx; + } + } + } +} +.fade-in { + animation: fade-in 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; +} + +@keyframes fade-in { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +.fade-out { + animation: fade-out .8s ease-out both; +} + +@keyframes fade-out { + 0% { + opacity: 1; + } + + 100% { + opacity: 0; + } +} diff --git a/static/toShare.png b/static/toShare.png new file mode 100644 index 0000000000000000000000000000000000000000..034b062e98771c42e5cfc8ded200ac0d2b485ba0 GIT binary patch literal 4688 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