mo 1 year ago
parent
commit
6108520917

BIN
src/components/layout/images/inBack.png


BIN
src/components/layout/images/inFront.png


BIN
src/components/layout/images/submitBtn.png


+ 64 - 7
src/components/layout/modals/suggestion-option.module.less

@@ -35,21 +35,51 @@
   }
 }
 
+.inBack {
+  width: 730px;
+  height: 668px;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
+
+.inFront {
+  width: 730px;
+  height: 277px;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  z-index: 200;
+}
+
+.submitBtn {
+  width: 272px;
+  height: 54px;
+  position: absolute;
+  z-index: 201;
+  bottom: 111px;
+  left: 50%;
+  margin-left: -136px;
+}
 
 .updatePassword {
   background-color: transparent;
   margin: 0 auto;
   position: relative;
+  overflow: hidden;
 
   // padding: 40px;
   .formWrap {
+    // top: 450px;
     background-color: #fff;
-    margin: 0 15px 42px;
+    margin: 0 15px 0;
     width: 700px;
     height: 836px;
     border-radius: 20px;
-    padding: 15px;
+    padding: 15px 15px 0;
     position: relative;
+    z-index: 100;
+    animation: forDown .3;
 
     .formTitle {
       text-align: center;
@@ -84,6 +114,28 @@
   }
 }
 
+@keyframes forDown {
+  0% {
+    top: 0
+  }
+
+  25% {
+    top: 100px
+  }
+
+  50% {
+    top: 200px
+  }
+
+  75% {
+    top: 350px
+  }
+
+  100% {
+    top: 450px;
+  }
+}
+
 .countInput {
   border-radius: 8px;
   min-height: 265px;
@@ -103,7 +155,7 @@
     }
 
     .n-input-wrapper {
-      // padding: 0 19px !important;
+      padding: 0 !important;
     }
 
     .n-input-word-count {
@@ -161,16 +213,21 @@
 }
 
 .messageWrap {
-  display: flex;
-  flex-direction: row;
+  // display: flex;
+  // flex-direction: row;
   align-items: center;
+  position: absolute;
+  bottom: 35px;
+  z-index: 202;
+  width: 100%;
+  text-align: center;
 
   p {
     height: 25px;
     font-size: 18px;
     font-weight: 400;
-    color: #777777;
+    color: #005FA0;
     line-height: 25px;
-    margin-right: 40px;
+    // margin-right: 40px;
   }
 }

+ 20 - 8
src/components/layout/modals/suggestion-option.tsx

@@ -18,7 +18,10 @@ import bgLine from '../images/bg-line.png';
 import chioseAdd from '../images/chioseAdd.png';
 import CSelect from '../../CSelect';
 import { policy } from '../../upload-file/api';
-import suggestClose from '../images/suggestClose.png'
+import suggestClose from '../images/suggestClose.png';
+import inFront from '../images/inFront.png';
+import inBack from '../images/inBack.png';
+import submitBtn from '../images/submitBtn.png';
 import {
   addSuggestion,
   getSuggestionList,
@@ -179,7 +182,10 @@ export default defineComponent({
     return () => (
       <div class={styles.updatePassword}>
         <div class={styles.formWrap}>
-          <NImage class={styles.closeBtn} src={suggestClose} previewDisabled ></NImage>
+          <NImage
+            class={styles.closeBtn}
+            src={suggestClose}
+            previewDisabled></NImage>
           <NImage class={styles.bgLine} src={bgLine} previewDisabled></NImage>
           <h2 class={styles.formTitle}>意见反馈</h2>
           <div class={styles.formWrapInfo}>
@@ -206,7 +212,7 @@ export default defineComponent({
                 ]}
                 path="suggestionTypeId">
                 <CSelect
-                class={styles.suggestSelect}
+                  class={styles.suggestSelect}
                   value-field="id"
                   label-field="name"
                   style={{ width: '227px!important' }}
@@ -260,20 +266,19 @@ export default defineComponent({
                     <NImage previewDisabled src={chioseAdd}></NImage>
                     <p> 点击上传图片</p>
                     <p>(最多五张)</p>
-
                   </div>
                 </NUpload>
               </NFormItem>
-              {phone.value || email.value ? (
+              {/* {phone.value || email.value ? (
                 <NFormItem>
                   <div class={styles.messageWrap}>
                     {phone.value ? <p>客服电话:{phone.value}</p> : null}
                     {email.value ? <p>邮箱:{email.value}</p> : null}
                   </div>
                 </NFormItem>
-              ) : null}
+              ) : null} */}
 
-              <NSpace class={styles.updateBtnGroup}>
+              {/* <NSpace class={styles.updateBtnGroup}>
                 <NButton
                   strong
                   type="default"
@@ -284,10 +289,17 @@ export default defineComponent({
                 <NButton strong type="primary" round onClick={() => onSubmit()}>
                   确认
                 </NButton>
-              </NSpace>
+              </NSpace> */}
             </NForm>
           </div>
         </div>
+        <NImage src={inBack} class={styles.inBack}></NImage>
+        <NImage src={inFront} class={styles.inFront}></NImage>
+        <NImage src={submitBtn} class={styles.submitBtn}></NImage>
+        <div class={styles.messageWrap}>
+          {phone.value ? <p>客服电话:{phone.value}</p> : null}
+          {email.value ? <p>邮箱:{email.value}</p> : null}
+        </div>
       </div>
     );
   }

+ 2 - 2
vite.config.ts

@@ -23,8 +23,8 @@ function resolve(dir: string) {
 }
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
-// const proxyUrl = 'https://dev.kt.colexiu.com/';
-const proxyUrl = 'https://test.lexiaoya.cn';
+const proxyUrl = 'https://dev.kt.colexiu.com/';
+// const proxyUrl = 'https://test.lexiaoya.cn';
 export default defineConfig({
   base: './',
   plugins: [