|
|
@@ -0,0 +1,106 @@
|
|
|
+<template>
|
|
|
+ <div class="main_container">
|
|
|
+ <img class="banner-card" :src="studentEntryIcon" alt="评价系统图标" />
|
|
|
+ <!-- 底部操作区域 -->
|
|
|
+ <div class="action-area">
|
|
|
+ <div class="input-group">
|
|
|
+ <div class="label">请输入评价码:</div>
|
|
|
+ <el-input
|
|
|
+ v-model="evaluationCode"
|
|
|
+ placeholder="请输入评价码"
|
|
|
+ size="large"
|
|
|
+ clearable
|
|
|
+ class="code-input"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ <div class="button-wrapper">
|
|
|
+ <el-button class="button_background" @click="handleEnter"> 进入</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import { ref } from 'vue';
|
|
|
+import { useRouter } from 'vue-router';
|
|
|
+import studentEntryIcon from '@/assets/appImg/app_entry_bg.png';
|
|
|
+import { ElMessage } from 'element-plus';
|
|
|
+import { reviewCodeLoginApi } from '@/api/studentEntry';
|
|
|
+
|
|
|
+
|
|
|
+const router = useRouter()
|
|
|
+const evaluationCode = ref(''); //评价码
|
|
|
+
|
|
|
+// 处理进入逻辑
|
|
|
+const handleEnter = async() => {
|
|
|
+ if (!evaluationCode.value) {
|
|
|
+ ElMessage.warning('请输入评价码')
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let res = await reviewCodeLoginApi(evaluationCode.value)
|
|
|
+ if(res?.code == 200){
|
|
|
+ localStorage.setItem('userInfo', JSON.stringify(res.data))
|
|
|
+ localStorage.setItem('token', res.data.tokenValue)
|
|
|
+ router.push('/main/questionnaireTaskListPage')
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.main_container {
|
|
|
+ overflow: auto;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #ffffff !important;
|
|
|
+ > *{
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .banner-card{
|
|
|
+ width: 100%;
|
|
|
+ height:calc(280 * var(--app-rpx)) ;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 操作区域样式 */
|
|
|
+ .action-area {
|
|
|
+ position: relative;
|
|
|
+ top:calc(-40 * var(--app-rpx));
|
|
|
+ width: 100%;
|
|
|
+ border-radius: 20px 20px 0 0;
|
|
|
+ background-color: white;
|
|
|
+ padding:calc(80 * var(--app-rpx)) calc(24 * var(--app-rpx)) calc(40 * var(--app-rpx));
|
|
|
+
|
|
|
+ overflow: auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: calc(80 * var(--app-rpx));
|
|
|
+
|
|
|
+ .input-group {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 100%;
|
|
|
+ gap:calc(16 * var(--app-rpx));
|
|
|
+ .label {
|
|
|
+ font-size: calc(16 * var(--app-rpx));
|
|
|
+ color: #000000;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ .code-input {
|
|
|
+ :deep(.el-input__wrapper) {
|
|
|
+ height: calc(48 * var(--app-rpx));
|
|
|
+ font-size: calc(16 * var(--app-rpx));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .button-wrapper {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ .button_background {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(48 * var(--app-rpx));
|
|
|
+ font-size: calc(16 * var(--app-rpx));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|