12-5 列出題目

1. 我們已經在某一個測驗頁面（exam.show）列出該測驗標題及表單以方便建立新題目，執行的路由是：

   Route::get('/exam/{exam}', 'ExamController@show')->name('exam.show');

2. 也就是執行的控制器是ExamController@show，所以，我們若打算把該測驗的既有題目也顯示在此頁面，我們就必須開啟/專案/app/Http/Controllers/ExamController.php，找出裡面的show()來取出目前已經有的所有題目列表。

   public function show(Exam $exam)
   {
       $topics = Topic::where('exam_id', $exam->id)->get();
       return view('exam.show', compact('exam', 'topics'));
   }

3. 另外，記得在上方加入：

   use App\Topic;

4. 接著在 /專案/resources/views/exam/show.blade.php 樣板當中加入題目列表：

   <dl>
       @forelse ($topics as $key => $topic)
           <dt>
               <h3>
               @can('建立測驗')
                   （{{$topic->ans}}）
               @endcan
               {{ bs()->badge()->text($key+1) }}
               {{$topic->topic}}
               </h3>
           </dt>
           <dd>
               {{ bs()->radioGroup("ans[$topic->id]", [
                       1=>"<span class='opt'>&#10102; $topic->opt1</span>",
                       2=>"<span class='opt'>&#10103; $topic->opt2</span>",
                       3=>"<span class='opt'>&#10104; $topic->opt3</span>",
                       4=>"<span class='opt'>&#10105; $topic->opt4</span>"
                   ])->inline()->addRadioClass(['mx-3']) }}
           </dd>
       @empty
           <div class="alert alert-danger">尚無任何題目</div>
       @endforelse
   </dl>

5. 選項數的地方我們是利用unicode來做的，例如：❶就可以顯示成 ❶ ，看起來比較清楚。

6. 圈圈數字可以看這裡：http://xahlee.info/comp/unicode_circled_numbers.html，所有的符號可以看這裡：http://www.utf8-chartable.de/unicode-utf8-table.pl

7. 修改 /public/css/app.css，加入選項的顏色設定和大小的設定

   .opt{
       color: rgb(17, 112, 136);
       font-size: 1.2em;
   }

8. 身份為教師時畫面如下：

9. 若是未登入者，暫時會呈現這樣（不過實際上，未登入應該不出現任何題目，以免題目外洩，這稍後處理）：