jpcj-pc/src/views/examInstructions/index.vue

<template>
  <div class="100vw">
    <img class="w-full" src="@/assets/img/login/top_bg.png" />
    <div class="pt30 w-full">
      <div class="flex justify-center">
        <div class="w1200 h543 bg-light-pink flex items-center content-center">
          <div class="text-left ml90 w-1/2">
            <div
              class="bg-primary-yellow pl25 pr25 lh50 font24 font-bold flex-grow-0 inline-block mb20"
            >
              考试须知
            </div>
            <div>
              <div
                class="text-left font18 font-bold"
                v-for="(item, index) in intro"
                :key="index"
              >
                {{ item }}
              </div>
            </div>
          </div>
          <div class="w-1/2 flex justify-center flex-wrap">
            <span class="font24 w-full font-bold">XX考场xx考台</span>
            <div class="mt30 font-semibold">
              <div class="text-left text-red-500 font20">
                身份证号:888888888888888888
              </div>
              <div class="text-left text-red-500 font20">考生姓名:夏紫云</div>
            </div>
            <div class="w-full mt30">
              <div
                class="bg-primary-yellow pl25 pr25 lh40 font24 font-bold flex-grow-0 inline-block mb20 round4 cursor-pointer"
              >
                确定
              </div>
            </div>
             <div class="text-left text-red-500 font20 font-bold">点击"确定"按钮开始考试！</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
  setup() {
    return {
      intro: [
        "1、遵守考场纪律服从监考人员指挥",
        "2、进入考场，手机、拷机关机。禁止抽烟禁止吃零食。",
        "3、未经工作人员允许考生禁止随意出入考场",

        "4、考场内禁止大声喧呼,禁止随意走动",
        "5、考试中认真答题不准交头接耳",
        "6、考试中不准冒名顶替不准弄虚作假",
        "7、注意考场卫生，禁止随地吐痰，禁止乱扔纸屑。",
        "8、爱护公物及考试设备",
      ],
    };
  },
});
</script>

<style scoped>
.w1200 {
  width: 1200px;
}
.bg-light-pink {
  background: #fffcef;
}
.bg-primary-yellow {
  background: #f9de5b;
}
</style>