feat: 临时保存

src/theme/override.js

@@ -6,7 +6,7 @@ export const themeOverrides = {
       "v-mono, SFMono-Regular, Menlo, Consolas, Courier, monospace",
     fontWeight: "400",
 
-    primaryColor: "#ffffff",
-    // primaryColorHover: "#7fe7c4",
+    primaryColor: "#910000",
+    primaryColorHover: "#910000",
   },
 };

src/views/feedback.vue

@@ -1,40 +1,110 @@
 <template>
   <div class="main">
     <div class="content">
-      <n-input
-      v-model:value="value"
-      type="textarea"
-      placeholder="请填入内容，5-500字"
-    />
+      <div class="left">
+        <n-input
+          v-model:value="feedBackContent"
+          type="textarea"
+          autosize
+          placeholder="请填入内容，5-500字"
+          style="min-height: 400px"
+        />
+
+        <n-space align="center" style="padding: 20px" justify="center">
+          <n-input type="text" placeholder="昵称" />
+          <n-input type="text" placeholder="联系方式" />
+          <n-input type="text" placeholder="请填入图形验证码" />
+        </n-space>
+        <n-space align="center" justify="center" style="padding: 20px">
+          <n-button type="primary"> 提交</n-button>
+        </n-space>
+      </div>
+      <div class="right">
+        <div class="logo"></div>
+        <div class="back" @click="$router.push('/')"></div>
+      </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { useFullscreen } from "@vueuse/core";
-const { isFullscreen, enter, exit, toggle } = useFullscreen();
-console.log("isFullscreen", isFullscreen);
+import { ref } from "vue";
+const feedBackContent = ref();
 </script>
+
 <style>
 .main {
-  --main-left-background: #e2caa3;
-  --main-right-background: #910000;
+  --main-left-background: grey;
+  --main-right-background: rgba(0, 0, 0, 0.8);
+  --logo-width: 100px;
+  --go-home-width: 60px;
+  --logo-background-color: rgba(0, 0, 0, 0.5);
+  --left-content-padding: 50px;
+  --right-content-padding: 50px;
 }
 </style>
 
-<style scoped>
+<style lang="scss" scoped>
 .main {
   width: 100%;
   height: 100%;
   display: flex;
+  flex-direction: column;
+  overflow-y: hidden;
+}
+.meta-title {
+  font-size: 34px;
+  padding-right: 50px;
+}
+.head {
+  width: 100%;
+  height: 60px;
+}
+.content {
+  flex: 1;
+  display: flex;
+  width: 100%;
+  height: 100%;
   flex-direction: row;
+  overflow: hidden;
 }
 .left {
-  flex: 0 0 70%;
+  flex: 1;
   background-color: var(--main-left-background);
+  padding: var(--left-content-padding);
+  .n-tabs {
+    height: 100%;
+    overflow: hidden;
+    :deep(.n-tab-pane) {
+      overflow-y: scroll;
+    }
+  }
+}
+.n-tabs {
+  --n-tab-font-size: 26px !important;
 }
 .right {
-  flex: 0 0 30%;
+  flex: 0 0 10%;
+  min-width: 120px;
+  /* max-width: 120px; */
+  height: calc(100% - var(--right-content-padding) * 2);
   background-color: var(--main-right-background);
+  display: flex;
+  padding: 50px 0;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  .logo {
+    width: var(--logo-width);
+    height: var(--logo-width);
+    border-radius: 50%;
+    background-color: var(--logo-background-color);
+  }
+  .back {
+    width: var(--go-home-width);
+    height: var(--go-home-width);
+    border-radius: 50%;
+    background-color: var(--logo-background-color);
+  }
 }
 </style>

src/views/info-detail.vue

@@ -64,13 +64,7 @@ onMounted(() => {
   flex: 1;
   background-color: var(--main-left-background);
   padding: var(--left-content-padding);
-  .n-tabs {
-    height: 100%;
-    overflow: hidden;
-    :deep(.n-tab-pane) {
-      overflow-y: scroll;
-    }
-  }
+  
 }
 .n-tabs {
   --n-tab-font-size: 26px !important;

src/views/survey-detail.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="main">
-    <n-input
-      v-model:value="value"
-      type="textarea"
-      placeholder="请填入内容，5-500字"
-    />
+    
   </div>
 </template>
 

src/views/survey.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="main">
-    <n-input
-      v-model:value="value"
-      type="textarea"
-      placeholder="请填入内容，5-500字"
-    />
+    
   </div>
 </template>