ソースを参照

feat: 1

dev_YWQ
congzc 1年前
コミット
47230dc88e
4個のファイルの変更41行の追加6行の削除
  1. バイナリ
      src/assets/video/loginVideo.mp4
  2. +0
    -2
      src/types/auto-imports.d.ts
  3. +36
    -3
      src/views/login/index.vue
  4. +5
    -1
      src/views/myStore/index.vue

バイナリ
src/assets/video/loginVideo.mp4 ファイルの表示


+ 0
- 2
src/types/auto-imports.d.ts ファイルの表示

@@ -5,7 +5,6 @@ declare global {
const ElForm: typeof import("element-plus/es")["ElForm"];
const ElMessage: typeof import("element-plus/es")["ElMessage"];
const ElMessageBox: typeof import("element-plus/es")["ElMessageBox"];
const ElTree: typeof import("element-plus/es")["ElTree"];
const asyncComputed: typeof import("@vueuse/core")["asyncComputed"];
const autoResetRef: typeof import("@vueuse/core")["autoResetRef"];
const computed: typeof import("vue")["computed"];
@@ -279,7 +278,6 @@ declare module "vue" {
readonly ElMessageBox: UnwrapRef<
typeof import("element-plus/es")["ElMessageBox"]
>;
readonly ElTree: UnwrapRef<typeof import("element-plus/es")["ElTree"]>;
readonly asyncComputed: UnwrapRef<
typeof import("@vueuse/core")["asyncComputed"]
>;


+ 36
- 3
src/views/login/index.vue ファイルの表示

@@ -1,6 +1,10 @@
<template>
<div class="login-container">
<div class="videoBox">
<video src="../../assets/video/loginVideo.mp4" muted autoplay></video>
</div>
<el-form
v-if="true"
ref="loginFormRef"
:model="loginData"
:rules="loginRules"
@@ -212,17 +216,27 @@ onMounted(() => {

<style lang="scss" scoped>
.login-container {
position: relative;
width: 100%;
min-height: 100%;
overflow: hidden;
background-color: #2d3a4b;
// background-color: #2d3a4b;

.login-form {
position: absolute;
top: 46%;
left: 10%;
width: 520px;
max-width: 100%;
padding: 160px 35px 0;
margin: 0 auto;
padding: 20px;
overflow: hidden;
background: linear-gradient(
225deg,
rgb(81 217 202 / 100%),
rgb(114 100 245 / 100%)
);
border-radius: 20px;
transform: translateY(-50%);

.captcha {
position: absolute;
@@ -238,6 +252,15 @@ onMounted(() => {
}
}

.videoBox {
position: absolute;
top: 0;
z-index: -1;
width: 100%;
height: 100%;
opacity: 0.8;
}

.el-form-item {
background: rgb(0 0 0 / 10%);
border: 1px solid rgb(255 255 255 / 10%);
@@ -276,4 +299,14 @@ onMounted(() => {
}
}
}

@keyframes rotate {
from {
transform: rotate(0deg);
}

to {
transform: rotate(360deg);
}
}
</style>

+ 5
- 1
src/views/myStore/index.vue ファイルの表示

@@ -1,5 +1,9 @@
<template>
<div class="page">商店</div>
<div class="page">
<div class="commoditylIst">
<div class="item"></div>
</div>
</div>
</template>
<script setup>
let title = ref("");


読み込み中…
キャンセル
保存