Explorar o código

feat: 临时保存

gemercheung hai 1 ano
pai
achega
152b23b510

+ 1 - 1
index.html

@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" type="image/ico" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title></title>
   </head>

BIN=BIN
public/favicon.ico


BIN=BIN
public/img/audio-muted.png


BIN=BIN
public/img/audio-unmuted.png


BIN=BIN
public/img/box_banner_bg.png


BIN=BIN
public/img/h_banner_bg.png


BIN=BIN
public/img/h_banner_bg_1.png


BIN=BIN
public/img/zoom-in.png


BIN=BIN
public/img/zoom-out.png


A diferenza do arquivo foi suprimida porque é demasiado grande
+ 0 - 1
public/vite.svg


+ 34 - 4
src/components/showCase.vue

@@ -1,7 +1,13 @@
 <template>
   <div class="show-case-container">
+    <div class="show-case">
+      <iframe
+        frameborder="0"
+        src="https://www.4dmodel.com/SuperTwo/index.html?m=TEST"
+      ></iframe>
+    </div>
     <div class="tools">
-      <n-space class="group-type">
+      <n-space class="group-type" :size="25">
         <n-button type="primary" round>模型</n-button>
         <n-button type="primary" round>视频</n-button>
         <n-button type="primary" round>图片</n-button>
@@ -18,10 +24,14 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, computed } from "vue";
 
-const type = ref();
+const type = ref("model");
 
+const isModel = computed(() => type.value === "model");
+const isVideo = computed(() => type.value === "video");
+const isAudio = computed(() => type.value === "audio");
+const isGallery = computed(() => type.value === "gallery");
 defineOptions({
   name: "show-case",
 });
@@ -50,8 +60,10 @@ const props = defineProps({
 .show-case-container {
   --show-case-width: 66.8125rem;
   --show-case-height: 34.1875rem;
+  --show-case-border-radius: 0.625rem;
   --show-case-background: #c1b2b2;
   --show-case-tools-padding: 1rem;
+  --show-case-btn-font-size: 1.125rem;
 }
 </style>
 
@@ -61,6 +73,15 @@ const props = defineProps({
   height: var(--show-case-height);
   position: relative;
   background-color: var(--show-case-background);
+  border-radius: var(--show-case-border-radius);
+  .show-case {
+    width: 100%;
+    height: 100%;
+    iframe {
+      width: 100%;
+      height: 100%;
+    }
+  }
 
   .tools {
     display: inline-flex;
@@ -68,18 +89,27 @@ const props = defineProps({
     bottom: 1.25rem;
     flex-direction: row;
     justify-content: space-between;
+    align-items: center;
     width: calc(100% - var(--show-case-tools-padding) * 2);
     padding: 0 var(--show-case-tools-padding);
-    .group-type,
+    pointer-events: none;
     .actions {
+      display: inline-flex;
+      align-items: center;
       img {
         height: 2.5rem;
         width: auto;
         margin: 0 0.3125rem;
         cursor: pointer;
+        pointer-events: all;
       }
     }
     .group-type {
+      :deep(.n-button) {
+        pointer-events: all;
+        font-size: var(--show-case-btn-font-size);
+        padding: 10px 40px;
+      }
     }
   }
 }

+ 1 - 0
src/style.css

@@ -2,6 +2,7 @@
   --main-primary-color: #910000;
   --main-secondary-color: #e2caa3;
   --main-box-shadow: 0px 2px 4px 0px rgba(46, 25, 16, 0.16);
+  --main-detail-background-img: url("/img/box_banner_bg.png");
   font-size: 16px;
 }
 

+ 6 - 2
src/views/feedback.vue

@@ -57,13 +57,17 @@ watchEffect(() => {
   --main-show-case-background: #ddd5d5;
   --main-detail-margin: 1.875rem;
   --main-detail-padding: 1.875rem;
-  box-shadow: var(--main-box-shadow);
+  // box-shadow: var(--main-box-shadow);
   margin: var(--main-detail-margin);
   margin-bottom: 0;
   flex: 1;
   border-radius: 0.8125rem;
-  background: #fff;
+  background-color: transparent;
   padding: 2rem 3rem 4rem 3rem;
+  background-image: var(--main-detail-background-img);
+  background-size: cover;
+  background-position: top 100%;
+  background-repeat: no-repeat;
 
   overflow-y: scroll;
   &::-webkit-scrollbar {

+ 1 - 1
src/views/home.vue

@@ -69,7 +69,7 @@ const { isFullscreen, enter, exit, toggle } = useFullscreen();
   --main-home-left-background: #e2caa3;
   --main-home-right-background: #910000;
   --main-right-border: 10px;
-  --main-right-bg-img: url("img/h_banner_bg_1.png");
+  --main-right-bg-img: url("img/h_banner_bg.png");
   --main-right-bg-btn1: url("/img/guide_1.png");
   --main-right-bg-btn2: url("/img/guide_2.png");
   --main-right-bg-btn3: url("/img/guide_3.png");

+ 4 - 2
src/views/survey-detail.vue

@@ -33,14 +33,16 @@ watchEffect(() => {
   --main-show-case-background: #ddd5d5;
   --main-detail-margin: 1.875rem;
   --main-detail-padding: 1.875rem;
-  box-shadow: var(--main-box-shadow);
   margin: var(--main-detail-margin);
   margin-bottom: 0;
   flex: 1;
   border-radius: 0.8125rem;
-  background: #fff;
   padding: 2rem 3rem 4rem 3rem;
   overflow-y: scroll;
+  background-image: var(--main-detail-background-img);
+  background-size: cover;
+  background-position: top 100%;
+  background-repeat: no-repeat;
 
   .back {
     background-image: url("/img/back_arrow.png");