From 21306411e7185938d0cedb95cb43cf963841cc58 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期三, 05 六月 2024 18:03:03 +0800 Subject: [PATCH] feat:答题信息 --- src/components/ExamInfo/index.vue | 22 +++++++++++ components.d.ts | 1 src/views/exam/components/answer-main/answer-single/index.vue | 32 ++++++++++++++++ src/assets/test.png | 0 src/views/exam/index.vue | 27 ++++++++++++- 5 files changed, 79 insertions(+), 3 deletions(-) diff --git a/components.d.ts b/components.d.ts index 7dfdc82..d9f6dd9 100644 --- a/components.d.ts +++ b/components.d.ts @@ -25,6 +25,7 @@ ElTabPane: typeof import('element-plus/es')['ElTabPane'] ElTabs: typeof import('element-plus/es')['ElTabs'] ElTag: typeof import('element-plus/es')['ElTag'] + ExamInfo: typeof import('./src/components/ExamInfo/index.vue')['default'] ExamInfoDialog: typeof import('./src/components/ExamInfoDialog/index.vue')['default'] Header: typeof import('./src/components/Header/index.vue')['default'] HelloWorld: typeof import('./src/components/HelloWorld.vue')['default'] diff --git a/src/assets/test.png b/src/assets/test.png new file mode 100644 index 0000000..61a7892 --- /dev/null +++ b/src/assets/test.png Binary files differ diff --git a/src/components/ExamInfo/index.vue b/src/components/ExamInfo/index.vue new file mode 100644 index 0000000..f768c33 --- /dev/null +++ b/src/components/ExamInfo/index.vue @@ -0,0 +1,22 @@ +<template> + <div class="info-container w-full"> + <div class="exam-title break-all mb-4 text-base text-gray-700"> + 1.娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯 + </div> + <div class="img-container flex"> + <div class="img-item"> + <img src="@/assets/test.png" class="width-img" alt=""> + </div> + </div> + </div> +</template> + +<script setup> + +</script> + +<style lang="scss" scoped> +.img-item { + max-width: 500px; +} +</style> \ No newline at end of file diff --git a/src/views/exam/components/answer-main/answer-single/index.vue b/src/views/exam/components/answer-main/answer-single/index.vue new file mode 100644 index 0000000..1c9d6ea --- /dev/null +++ b/src/views/exam/components/answer-main/answer-single/index.vue @@ -0,0 +1,32 @@ +<template> + <div class="answer-container w-full h-full"> + <el-scrollbar> + <ExamInfo></ExamInfo> + + <div class="answer-content"> + <div class="answer-item flex"> + <div class="answer-icon flex justify-center items-center">A</div> + <div class="answer-text"></div> + </div> + </div> + + </el-scrollbar> + </div> +</template> + +<script setup> +import ExamInfo from '@/components/ExamInfo/index.vue'; +</script> + +<style lang="scss" scoped> +.answer-item { + max-width: 400px; + border-radius: 10px; + padding: 10px 0; + border: 1px solid #EBEEF5; + .answer-icon { + width: 50px; + height: 100%; + } +} +</style> \ No newline at end of file diff --git a/src/views/exam/index.vue b/src/views/exam/index.vue index 5c3c485..ec0bc4c 100644 --- a/src/views/exam/index.vue +++ b/src/views/exam/index.vue @@ -8,6 +8,7 @@ 娴嬭瘯娴嬭瘯娴嬭瘯 </div> </div> + <div class="exam-main grow flex justify-between"> <!-- 绛旈鍗″尯 --> <div class="answer-wrapper answer-left mr-8 shadow-xl p-4 box-border"> @@ -28,7 +29,7 @@ </div> <div class="submit-wrapper"> - <el-button type="primary" class="submit-button w-40">鎻愪氦璇曞嵎</el-button> + <el-button type="primary" class="submit-button">鎻愪氦璇曞嵎</el-button> </div> </div> @@ -41,8 +42,21 @@ <div class="title text-xl font-semibold ">鍗曢�夐 (3鍒�)</div> </div> - <div class="main-wrapper"> + <div class="main-wrapper w-full grow relative my-5"> + <div class="main-content absolute top-0 bottom-0 w-full"> + <AnswerSingle></AnswerSingle> + </div> + </div> + <div class="tool-wrapper flex justify-end"> + <div class="button-container flex items-center"> + <div class="button-item"> + <el-button class="tool-button">涓婁竴棰�</el-button> + </div> + <div class="button-item"> + <el-button class="tool-button" type="primary">涓嬩竴棰�</el-button> + </div> + </div> </div> @@ -58,6 +72,8 @@ import AnswerTag from './components/answer-tag/index.vue'; import AnswerProgress from './components/answer-progress/index.vue'; import AnswerSheet from './components/answer-sheet/index.vue'; +import AnswerSingle from './components/answer-main/answer-single/index.vue'; + </script> @@ -101,7 +117,12 @@ width: 340px; } -.submit-button { +.submit-button, +.tool-button { + width: 160px; height: 40px; } +.tool-button { + margin: 0 20px; +} </style> \ No newline at end of file -- Gitblit v1.8.0