提交

1

src/components/layout/index.module.less

@@ -223,6 +223,21 @@
           transition: 0.2s;
         }
       }
+
+      .optons {
+        width: 32px;
+        height: 32px;
+        margin-right: 24px;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        cursor: pointer;
+
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
     }
   }
 }
@@ -245,6 +260,8 @@
   }
 }
 
+
+
 .propWrap {
   background-color: var(--n-color);
   border-radius: 16px;

src/components/layout/index.tsx

@@ -31,6 +31,7 @@ import { state } from '/src/state';
 import PreviewWindow from '/src/views/preview-window';
 import { fscreen } from '@/utils/index';
 import AttendClass from '/src/views/prepare-lessons/model/attend-class';
+
 export default defineComponent({
   name: 'layoutView',
   setup() {
@@ -634,10 +635,11 @@ export default defineComponent({
 
         <NModal
           class={['modalTitle background']}
+          style={{ width: '687px' }}
           title={'节拍器'}
           preset="card"
-          v-model:show={showModalBeat.value}
-          style={{ width: '687px' }}>
+          v-model:show={showModalBeat.value}>
+
           <div class={styles.modeWrap}>
             <iframe
               src={`${vaildUrl()}/metronome/?id=${new Date().getTime()}`}

src/components/layout/layoutTop.tsx

@@ -11,11 +11,11 @@ import personIcon from './images/personIcon.png';
 import { useUserStore } from '@/store/modules/users';
 import { useRouter } from 'vue-router';
 import { storeToRefs } from 'pinia';
-
+import opinionIcon from './images/opinionIcon.png'
 import 'animate.css';
 import ForgotPassword from '/src/views/setting/modal/forgotPassword';
 import ImGroup from './imGroup';
-
+import SuggestionOption from './modals/suggestion-option'
 export default defineComponent({
   name: 'layoutTop',
   setup() {
@@ -24,7 +24,7 @@ export default defineComponent({
     const showHeadFlag = ref(false);
     const showImGroup = ref(false);
     const showImGroupLoading = ref(true);
-
+    const showSuggestionViseble = ref(true)
     const users = useUserStore();
     const showWord = ref(false);
     const { info } = storeToRefs(users);
@@ -86,6 +86,9 @@ export default defineComponent({
             </p>
           </div>
           <div class={styles.layoutRight}>
+            <div class={styles.optons} onClick={()=>showSuggestionViseble.value = true}>
+                <NImage src={opinionIcon} previewDisabled></NImage>
+            </div>
             <div onClick={() => (showImGroup.value = true)}>
               <NBadge
                 value={noReadCount.value}
@@ -230,6 +233,17 @@ export default defineComponent({
             displayDirective="show">
             <ImGroup />
           </NModal>
+
+
+          <NModal
+            class={['modalTitle', 'background']}
+            style={{ width: '687px' }}
+            v-model:show={showSuggestionViseble.value}
+            preset="card"
+            showIcon={false}
+            title="意见反馈">
+              <SuggestionOption></SuggestionOption>
+          </NModal>
         </div>
       </>
     );

src/components/layout/modals/suggestion-option.module.less

@@ -0,0 +1,11 @@
+.updateBtnGroup {
+  padding: 0;
+  justify-content: center !important;
+
+  :global {
+    .n-button {
+      height: 48px !important;
+      min-width: 156px;
+    }
+  }
+}

src/components/layout/modals/suggestion-option.tsx

@@ -0,0 +1,73 @@
+import { defineComponent, onMounted, reactive, ref } from 'vue';
+import styles from './update-password.module.less';
+import {
+  NButton,
+  NForm,
+  NFormItem,
+  NInput,
+  NSelect,
+  NSpace,
+  useMessage
+} from 'naive-ui';
+import { useRouter } from 'vue-router';
+import { useUserStore } from '/src/store/modules/users';
+import { gradeToCN } from '/src/utils/contants';
+import { sendSms } from '/src/views/login/api';
+import { updatePassword } from '@/views/home/api';
+import openEye from '/src/views/login/images/openEye.png';
+import closeEye from '/src/views/login/images/closeEye.png';
+export default defineComponent({
+  name: 'train-update',
+  emits: ['close', 'submit'],
+  setup(props, { emit }) {
+    const message = useMessage();
+    const userStore = useUserStore();
+    const forms = reactive({
+      mobile: userStore.getUserInfo.phone || '',
+      password: null,
+      rePassword: null,
+      clientType: 'TEACHER',
+      code: null
+    });
+
+
+
+
+
+    const formsRef = ref();
+    const onSubmit = () => {
+      console.log('onSubmit')
+    }
+
+    return () => (
+      <div class={styles.updatePassword}>
+        <NForm
+          labelAlign="right"
+          labelPlacement="left"
+          labelWidth={'auto'}
+          ref={formsRef}
+          model={forms}
+          requireMarkPlacement="left">
+          <NFormItem
+            path="currentClass"
+            label=""
+            class={styles.phoneContainer}>
+            <p class={styles.phone}>{forms.mobile}</p>
+          </NFormItem>
+
+
+
+          <NSpace class={styles.updateBtnGroup}>
+            <NButton strong type="default" round onClick={() => emit('close')}>
+              取消
+            </NButton>
+            <NButton strong type="primary" round onClick={() => onSubmit()}>
+              确认
+            </NButton>
+          </NSpace>
+
+        </NForm>
+      </div>
+    );
+  }
+});