![\"\"](\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/06\/20250605074738-68414b9ab3520.jpg\")
<\/p>\n\u5148\u4e0a\u6548\u679c\u56fe<\/p>\n
<\/p>\n
![\"\"](\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2025\/06\/20250605074739-68414b9b5a0e1.jpg\")
\u00a0<\/p>\n
\u00a0\u6837\u5f0f<\/p>\n
<template>
\n <div class="activity-questions">
\n <h1>\u6d3b\u52a8\u9898\u5e93<\/h1>
\n <div v-if="loading" class="loading">\u52a0\u8f7d\u4e2d…<\/div>
\n <div v-else>
\n <div v-if="questions.length === 0" class="no-questions">\u6682\u65e0\u9898\u5e93<\/div>
\n <div v-else class="questions-container">
\n <div v-for="question in questions" :key="question.id" class="question-item">
\n <img v-if="question.image_url" :src="question.image_url" alt="\u9898\u76ee\u56fe\u7247" class="question-image" \/>
\n <p class="question-text">{{ question.description }}<\/p>
\n <div class="options">
\n <p v-if="question.option_a">A: {{ question.option_a }}<\/p>
\n <p v-if="question.option_b">B: {{ question.option_b }}<\/p>
\n <p v-if="question.option_c">C: {{ question.option_c }}<\/p>
\n <p v-if="question.option_d">D: {{ question.option_d }}<\/p>
\n <p v-if="question.option_e">E: {{ question.option_e }}<\/p>
\n <p v-if="question.option_f">F: {{ question.option_f }}<\/p>
\n <p v-if="question.option_g">G: {{ question.option_g }}<\/p>
\n <p v-if="question.option_h">H: {{ question.option_h }}<\/p>
\n <p v-if="question.option_i">I: {{ question.option_i }}<\/p>
\n <p v-if="question.option_j">J: {{ question.option_j }}<\/p>
\n <\/div>
\n <\/div>
\n <\/div>
\n <\/div>
\n <\/div>
\n<\/template><\/p>\n
<script>
\nimport { getQuestionsByActivityConfig } from '@\/api\/biz\/biz_question';<\/p>\n
export default {
\n name: 'ActivityQuestions',
\n data() {
\n return {
\n activityId: null,
\n questions: [],
\n loading: true,
\n };
\n },
\n async created() {
\n const urlParams = new URLSearchParams(window.location.search);
\n this.activityId = urlParams.get('activity_id') || '1';<\/p>\n
if (this.activityId) {
\n try {
\n const response = await getQuestionsByActivityConfig(this.activityId);
\n if (response && response.code === 200) {
\n this.questions = response.data;
\n } else {
\n console.error('\u9898\u5e93\u52a0\u8f7d\u5931\u8d25', response);
\n }
\n } catch (error) {
\n console.error('\u83b7\u53d6\u9898\u5e93\u65f6\u53d1\u751f\u9519\u8bef', error);
\n } finally {
\n this.loading = false;
\n }
\n } else {
\n console.error('\u6d3b\u52a8ID\u672a\u63d0\u4f9b');
\n this.loading = false;
\n }
\n },
\n};
\n<\/script><\/p>\n
<style scoped>
\n.activity-questions {
\n text-align: center;
\n padding: 20px;
\n}
\n.loading {
\n font-size: 18px;
\n color: #888;
\n}
\n.no-questions {
\n font-size: 18px;
\n color: #888;
\n}
\n.questions-container {
\n display: grid;
\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
\n gap: 20px;
\n justify-content: center;
\n}
\n.question-item {
\n border: 1px solid #ddd;
\n border-radius: 8px;
\n padding: 15px;
\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
\n text-align: center;
\n}
\n.question-image {
\n max-width: 100%;
\n height: auto;
\n border-radius: 4px;
\n}
\n.question-text {
\n font-size: 18px;
\n margin-top: 10px;
\n font-weight: bold;
\n}
\n.options p {
\n font-size: 16px;
\n margin: 5px 0;
\n}
\n<\/style><\/p>\n","protected":false},"excerpt":{"rendered":"
\u6587\u7ae0\u6d4f\u89c8\u9605\u8bfb167\u6b21\u3002\u8be5\u4ee3\u7801\u5b9e\u73b0\u4e86\u4e00\u4e2a\u6d3b\u52a8\u9898\u5e93\u7684Vue\u7ec4\u4ef6\uff0c\u4e3b\u8981\u529f\u80fd\u5305\u62ec\uff1a1)\u901a\u8fc7activity_id\u53c2\u6570\u83b7\u53d6\u9898\u76ee\u6570\u636e\uff1b2)\u663e\u793a\u52a0\u8f7d\u72b6\u6001\u548c\u7a7a\u9898\u5e93\u63d0\u793a\uff1b3)\u4ee5\u7f51\u683c\u5e03\u5c40\u5c55\u793a\u9898\u76ee\u53ca\u9009\u9879\uff0c\u652f\u6301\u56fe\u7247\u663e\u793a\u3002\u7ec4\u4ef6\u5305\u542b\u4e09\u4e2a\u72b6\u6001\uff1a\u52a0\u8f7d\u4e2d\u3001\u65e0\u9898\u5e93\u548c\u6709\u9898\u5e93\u72b6\u6001\uff0c\u9898\u76ee\u9009\u9879\u4eceA\u5230J\u52a8\u6001\u663e\u793a\u3002\u6837\u5f0f\u91c7\u7528\u54cd\u5e94\u5f0f\u8bbe\u8ba1\uff0c\u9898\u76ee\u5361\u7247\u5e26\u8fb9\u6846\u9634\u5f71\u6548\u679c\u3002\u901a\u8fc7API\u83b7\u53d6\u6570\u636e\uff0c\u5e76\u5904\u7406\u53ef\u80fd\u7684\u9519\u8bef\u60c5\u51b5\u3002\u6574\u4f53\u754c\u9762\u7b80\u6d01\uff0c\u529f\u80fd\u5b8c\u6574\u3002<\/p>\n","protected":false},"author":2,"featured_media":41873,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[573,458,87],"topic":[],"class_list":["post-41875","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-css","tag-vue","tag-87"],"yoast_head":"\n