From 6a2412ce9f2e00b259b735335fb69c9edb27fc4a Mon Sep 17 00:00:00 2001
From: waruneeta <warunee.auy@gmail.com>
Date: Tue, 26 Sep 2023 15:27:14 +0700
Subject: [PATCH 1/3] =?UTF-8?q?=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88?=
 =?UTF-8?q?=E0=B8=A1=E0=B9=81=E0=B8=AA=E0=B8=94=E0=B8=87=E0=B8=9C=E0=B8=A5?=
 =?UTF-8?q?=E0=B8=97=E0=B8=94=E0=B8=A5=E0=B8=AD=E0=B8=87=E0=B8=87=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FormEvaluation/FormEvaluateScore copy.vue | 1607 -----------------
 .../FormEvaluation/FormSaveResult.vue         |  513 ++----
 .../FormEvaluation/FormSaveResultAdd.vue      |  662 ++-----
 .../FormSaveResultAddCommander.vue            |   20 +-
 .../FormEvaluation/FormSaveResultCommader.vue |  517 ++----
 src/modules/05_placement/storeProbation.ts    |    5 +-
 6 files changed, 399 insertions(+), 2925 deletions(-)
 delete mode 100644 src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore copy.vue

diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore copy.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore copy.vue
deleted file mode 100644
index 8c9b901c5..000000000
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore copy.vue	
+++ /dev/null
@@ -1,1607 +0,0 @@
-<script setup lang="ts">
-import { ref, watch, computed, onMounted } from "vue";
-import { useQuasar } from "quasar";
-import { useProbationDataStore } from "@/modules/05_placement/storeProbation";
-import { useCounterMixin } from "@/stores/mixin";
-import { useRouter, useRoute } from "vue-router";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import criterion from "@/modules/05_placement/components/Other/Criterion.vue"
-
-const router = useRouter();
-const routeName = router.currentRoute.value.name;
-const $q = useQuasar();
-const probationStore = useProbationDataStore();
-const { ratingColors } = probationStore;
-const { assign } = probationStore;
-const mixin = useCounterMixin();
-const {
-  date2Thai,
-  notifyError,
-  messageError,
-  showLoader,
-  hideLoader,
-  dateToISO,
-  success,
-  dialogConfirm,
-} = mixin;
-const route = useRoute();
-const assignId = ref<string>(route.params.form.toString());
-const personalId = ref<string>(route.params.personalId.toString());
-const saveEdit = (id: string) => {
-  dialogConfirm($q, () => console.log("save"));
-};
-const edit = () => {
-  status.value = true;
-};
-const cancel = () => {
-  status.value = false;
-};
-const evaluate_no = ref<number>();
-const evaluate_id = ref<string>("");
-const start_date = ref<Date>(new Date());
-const date_finish = ref<Date>(new Date());
-const status = ref<boolean>(true);
-const chairman = ref<any>([]);
-const commander = ref<any>([]);
-const mentors = ref<any>([{ name: "" }, { name: "" }]);
-const dataArr = ref<any>();
-const props = defineProps({
-  tab: String,
-  data: Object,
-  action: String,
-});
-
-onMounted(async () => {
-  if (props.tab && props.action == "edit") {
-    evaluate_no.value = Number(props.tab.charAt(4));
-    dataArr.value = await props.data;
-    await fetchEvaluate();
-    await fecthAssign();
-  }
-});
-
-watch(props, async () => {
-  if (props.tab && props.action == "edit") {
-    evaluate_no.value = Number(props.tab.charAt(4));
-    dataArr.value = await props.data;
-    await fetchEvaluate();
-    await fecthAssign();
-  }
-});
-
-const fecthAssign = async () => {
-  showLoader();
-  await http
-    .get(config.API.evaluateChairman(assignId.value))
-    .then(async (res: any) => {
-      if (props.action == "add") {
-        assign.value = res.data.data.assign;
-        evaluate_no.value = res.data.data.evaluate_no;
-        start_date.value = res.data.data.start_date;
-        date_finish.value = res.data.data.end_date;
-        chairman.value = res.data.data.chairman;
-        commander.value = res.data.data.commander;
-        mentors.value = res.data.data.mentors;
-      }
-      chairman.value = res.data.data.chairman;
-      commander.value = res.data.data.commander;
-      mentors.value = res.data.data.mentors;
-      console.log(commander.value.name);
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      if (props.action == "edit") {
-        fetchEvaluate();
-      }
-      hideLoader();
-    });
-};
-
-const fetchEvaluate = async () => {
-  // showLoader();
-  try {
-    let data = await dataArr.value;
-    evaluate_id.value = data.id;
-    start_date.value = data.date_start;
-    date_finish.value = data.date_finish;
-    learn_level.value = data.knowledge_level;
-    apply_level.value = data.apply_level;
-    success_level.value = data.success_level;
-    achievement_other.value.text = data.achievement_other_desc;
-    achievement_other.value.level = data.achievement_other_level;
-    conduct_level.value[0] = data.conduct1_level;
-    conduct_level.value[1] = data.conduct2_level;
-    conduct_level.value[2] = data.conduct3_level;
-    conduct_level.value[3] = data.conduct4_level;
-    moral_level.value[0] = data.moral1_level;
-    moral_level.value[1] = data.moral2_level;
-    moral_level.value[2] = data.moral3_level;
-    discipline_level.value[0] = data.discipline1_level;
-    discipline_level.value[1] = data.discipline2_level;
-    discipline_level.value[2] = data.discipline3_level;
-    discipline_level.value[3] = data.discipline4_level;
-    discipline_level.value[4] = data.discipline5_level;
-    behavio_orther.value.text = data.behavior_other_desc;
-    behavio_orther.value.level = data.behavior_other_level;
-    orientation.value = data.develop_orientation_score;
-    self_learning.value = data.develop_self_learning_score;
-    training_seminar.value = data.develop_training_seminar_score;
-    other_training.value = data.develop_other_training_score;
-    orientation_percent.value = data.develop_orientation_percent;
-    self_learning_percent.value = data.develop_self_learning_percent;
-    training_seminar_percent.value = data.develop_training_seminar_percent;
-    other_training_percent.value = data.develop_other_training_percent;
-    develop_result.value = data.develop_result;
-    evaluate_result.value = data.evaluate_result;
-
-    if (
-      data.achievement_other_desc !== "" &&
-      data.achievement_other_level !== null
-    ) {
-      etc.value = true;
-    } else etc.value = false;
-    if (data.behavior_other_desc !== "" && data.behavior_other_level !== null) {
-      etc2.value = true;
-    } else etc2.value = false;
-
-    status.value = false;
-    // setTimeout(() => {
-    //   hideLoader();
-    // }, 1000);
-  } catch (error) {
-    // hideLoader();
-  }
-};
-
-const list2_1 = probationStore.behavior_no1;
-const list2_2 = probationStore.behavior_no2;
-const list2_3 = probationStore.behavior_no3;
-
-// part 1
-const learn_level = ref<number>(0);
-const apply_level = ref<number>(0);
-const success_level = ref<number>(0);
-const etc = ref<any>(false);
-const achievement_other = ref<any>({ text: "", level: 0 });
-// part 2
-const conduct_level = ref<any>([]);
-const moral_level = ref<any>([]);
-const discipline_level = ref<any>([]);
-const etc2 = ref<any>(false); // checkBox 2.4
-const behavio_orther = ref<any>({ text: "", level: 0 });
-
-// part 3
-const orientation = ref<number>(0);
-const self_learning = ref<number>(0);
-const training_seminar = ref<number>(0);
-const other_training = ref<number>(0);
-const orientation_percent = ref<number>(0);
-const self_learning_percent = ref<number>(0);
-const training_seminar_percent = ref<number>(0);
-const other_training_percent = ref<number>(0);
-const develop_result = ref<any>();
-const evaluate_result = ref<any>();
-const evaluate_result_option = ref<any>([
-  { name: "ผ่าน", value: 1 },
-  { name: "ไม่ผ่าน", value: 0 },
-]);
-
-const develop_result_option = ref<any>([
-  { name: "ผ่าน (สูงกว่าร้อยละ 60)", value: 1 },
-  { name: "ไม่ผ่าน (ต่ำกว่าร้อยละ 60)", value: 0 },
-]);
-// footer
-const dateAutherise = ref<any>(new Date());
-// const option = ref<any>([]);
-
-// score
-const score1 = computed(() => {
-  if (
-    etc.value === true &&
-    achievement_other.value.text !== undefined &&
-    achievement_other.value.level !== undefined
-  ) {
-    return (
-      learn_level.value +
-      apply_level.value +
-      success_level.value +
-      achievement_other.value.level
-    );
-  }
-  return learn_level.value + apply_level.value + success_level.value;
-});
-const achievement_score_total: any = computed(() => {
-  if (
-    etc.value === true &&
-    achievement_other.value.text !== undefined &&
-    achievement_other.value.level !== undefined
-  ) {
-    return 20;
-  }
-  return 15;
-});
-const achievement_result: any = computed(() => {
-  if (percent_score1.value > 60) {
-    return 1;
-  }
-  return 0;
-});
-const score2 = computed(() => {
-  let sum_conduct = conduct_level.value.reduce(
-    (sum: number, level: number) => sum + level,
-    0
-  );
-  let sum_moral = moral_level.value.reduce(
-    (sum: number, level: number) => sum + level,
-    0
-  );
-  let sum_discipline = discipline_level.value.reduce(
-    (sum: number, level: number) => sum + level,
-    0
-  );
-  if (
-    etc2.value === true &&
-    behavio_orther.value.text !== undefined &&
-    behavio_orther.value.level !== undefined
-  ) {
-    return (
-      sum_conduct + sum_moral + sum_discipline + behavio_orther.value.level
-    );
-  } else return sum_conduct + sum_moral + sum_discipline;
-});
-const behavior_score_total: any = computed(() => {
-  if (
-    etc2.value === true &&
-    behavio_orther.value.text !== undefined &&
-    behavio_orther.value.level !== undefined
-  ) {
-    return 65;
-  } else return 60;
-});
-const behavior_result: any = computed(() => {
-  if (percent_score2.value > 60) {
-    return 1;
-  }
-  return 0;
-});
-const percent_score1: any = computed(() => {
-  let num = 0;
-  if (etc.value === true) {
-    num = 20;
-  } else num = 15;
-  let percent1 = (score1.value / num) * 100;
-  return percent1.toFixed(2);
-});
-const percent_score2: any = computed(() => {
-  let num = 0;
-  if (etc2.value === true) {
-    num = 65;
-  } else num = 60;
-  let percent2 = (score2.value / num) * 100;
-  return percent2.toFixed(2);
-});
-const percent_sum: any = computed(() => {
-  let sum = (Number(percent_score1.value) + Number(percent_score2.value)) / 2;
-  return sum.toFixed(2);
-});
-const score4 = computed(() => {
-  return (
-    Number(orientation.value) +
-    Number(self_learning.value) +
-    Number(training_seminar.value) +
-    Number(other_training.value)
-  );
-});
-const score5 = computed(() => {
-  return (
-    Number(orientation_percent.value) +
-    Number(self_learning_percent.value) +
-    Number(training_seminar_percent.value) +
-    Number(other_training_percent.value)
-  );
-});
-
-const savaForm = () => {
-  let hasError = false;
-  if (
-    learn_level.value === 0 ||
-    apply_level.value === 0 ||
-    success_level.value === 0 ||
-    conduct_level.value.length < 4 ||
-    moral_level.value.length < 3 ||
-    discipline_level.value.length < 5 ||
-    orientation.value === null ||
-    self_learning.value === null ||
-    training_seminar.value === null
-  ) {
-    hasError = true;
-  } else if (
-    (etc.value == true &&
-      (achievement_other.value.text === undefined ||
-        achievement_other.value.text == "" ||
-        achievement_other.value.level == undefined ||
-        achievement_other.value.level === 0)) ||
-    (etc2.value == true &&
-      (behavio_orther.value.text === undefined ||
-        behavio_orther.value.text == "" ||
-        behavio_orther.value.level === undefined ||
-        behavio_orther.value.level == 0))
-  ) {
-    hasError = true;
-  } else putformData();
-
-  if (hasError === true) {
-    notifyError($q, "กรุณากรอกข้อมูลให้ครบ");
-  }
-};
-
-const putformData = () => {
-  const data = {
-    evaluate_no: evaluate_no.value,
-    start_date: start_date.value,
-    date_finish: date_finish.value,
-    knowledge_level: learn_level.value,
-    apply_level: apply_level.value,
-    success_level: success_level.value,
-    achievement_other: achievement_other.value,
-    conduct1_level: conduct_level.value[0],
-    conduct2_level: conduct_level.value[1],
-    conduct3_level: conduct_level.value[2],
-    conduct4_level: conduct_level.value[3],
-    moral1_level: moral_level.value[0],
-    moral2_level: moral_level.value[1],
-    moral3_level: moral_level.value[2],
-    discipline1_level: discipline_level.value[0],
-    discipline2_level: discipline_level.value[1],
-    discipline3_level: discipline_level.value[2],
-    discipline4_level: discipline_level.value[3],
-    discipline5_level: discipline_level.value[4],
-    behavior_orther: behavio_orther.value,
-    develop_orientation_score: Number(orientation.value),
-    develop_self_learning_score: Number(self_learning.value),
-    develop_training_seminar_score: Number(training_seminar.value),
-    develop_other_training_score: Number(other_training.value),
-    develop_orientation_percent: Number(orientation_percent.value),
-    develop_self_learning_percent: Number(self_learning_percent.value),
-    develop_training_seminar_percent: Number(training_seminar_percent.value),
-    develop_other_training_percent: Number(other_training_percent.value),
-    achievement_score: Number(score1.value),
-    achievement_percent: Number(percent_score1.value),
-    achievement_score_total: Number(achievement_score_total.value),
-    achievement_result: Number(achievement_result.value),
-    behavior_score: Number(score2.value),
-    behavior_percent: Number(percent_score2.value),
-    behavior_score_total: Number(behavior_score_total.value),
-    behavior_result: Number(behavior_result.value),
-    sum_score: Number(score1.value) + Number(score2.value),
-    sum_percent: percent_sum.value,
-    chairman_dated: dateToISO(dateAutherise.value),
-    develop_result: Number(develop_result.value),
-    evaluate_result: Number(evaluate_result.value),
-  };
-
-  dialogConfirm($q, async () => {
-    await http
-      .put(
-        config.API.editFormEvaluateChairman(assignId.value, evaluate_id.value),
-        data
-      )
-      .then((res: any) => {
-        status.value = false;
-        success($q, "บันทึกสำเร็จ");
-        router.push(`/probation/detail/${personalId.value}/${assignId.value}`);
-      })
-      .catch((e: any) => {
-        messageError($q, e);
-      });
-  });
-};
-</script>
-
-<template>
-  <div class="row col-12 no-margin q-pa-sm">
-    <div class="toptitle text-dark col-12 row items-center q-gutter-md">
-      <div>แบบประเมินผล (คณะกรรมการ)</div>
-      <!-- <q-space /> -->
-      <div v-if="status == false">
-        <q-btn
-          dense
-          flat
-          round
-          color="primary"
-          @click="edit()"
-          icon="mdi-pencil-outline"
-        >
-          <q-tooltip>แก้ไขข้อมูล</q-tooltip>
-        </q-btn>
-      </div>
-      <div v-else>
-        <q-btn dense flat round color="red" @click="cancel()" icon="mdi-undo">
-          <q-tooltip>ยกเลิก</q-tooltip>
-        </q-btn>
-        <q-btn
-          dense
-          class="q-ml-sm"
-          flat
-          round
-          color="public"
-          @click="savaForm()"
-          icon="mdi-content-save-outline"
-        >
-          <q-tooltip>บันทึกข้อมูล</q-tooltip>
-        </q-btn>
-      </div>
-    </div>
-    <div class="row col-12 q-gutter-lg">
-      <div class="col-12 row">
-        <div class="col-12 text-top0 row items-center">
-          <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          วันเริ่มทดลองปฏิบัติหน้าที่ราชการ ตั้งแต่วันที่
-          <span class="text-black q-px-sm">{{
-            date2Thai(assign.date_start)
-          }}</span>
-          ถึงวันที่
-          <span class="text-black q-px-sm">{{
-            date2Thai(assign.date_finish)
-          }}</span>
-        </div>
-        <div class="col-12 text-top0 row items-center">
-          <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          <span class="text-primary q-pr-sm">{{
-            "ครั้งที่ " + evaluate_no
-          }}</span>
-          ระหว่างวันที่
-          <span class="text-black q-px-sm">{{ date2Thai(start_date) }}</span>
-          ถึงวันที่
-          <span class="text-black q-px-sm">{{ date2Thai(date_finish) }}</span>
-        </div>
-        <div class="col-12 q-pt-md">
-          <q-separator size="3px" color="grey-2" />
-        </div>
-        <criterion />
-        <div class="col-12 q-pt-md">
-          <q-separator size="3px" color="grey-2" />
-        </div>
-      </div>
-
-      <div class="col-12 row">
-        <div class="col-12 text-top0 items-center">
-          <q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
-          ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ
-        </div>
-      </div>
-      <div class="col-12 row no-margin">
-        <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label>
-                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.1. ความสามารถในการเรียนรู้งาน</q-item-label
-                >
-              </q-item-section>
-              <q-item-section side>
-                <q-rating
-                  v-model="learn_level"
-                  max="5"
-                  size="sm"
-                  :disable="!status"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                >
-                  <template v-slot:tip-1>
-                    <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-2>
-                    <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-3>
-                    <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-4>
-                    <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-5>
-                    <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                  </template>
-                </q-rating>
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-
-        <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label>
-                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.2.
-                  ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label
-                >
-              </q-item-section>
-              <q-item-section side>
-                <q-rating
-                  v-model="apply_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :disable="!status"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                >
-                  <template v-slot:tip-1>
-                    <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-2>
-                    <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-3>
-                    <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-4>
-                    <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-5>
-                    <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                  </template>
-                </q-rating>
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-
-        <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label>
-                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.3. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label
-                >
-              </q-item-section>
-              <q-item-section side>
-                <q-rating
-                  v-model="success_level"
-                  max="5"
-                  :disable="!status"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                >
-                  <template v-slot:tip-1>
-                    <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-2>
-                    <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-3>
-                    <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-4>
-                    <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-5>
-                    <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                  </template>
-                </q-rating>
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-
-        <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label>
-                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.4 อื่นๆ
-                  <q-checkbox
-                    class="q-ml-sm"
-                    dense
-                    :disable="!status"
-                    v-model="etc"
-                    @click="
-                      (achievement_other.text = ''),
-                        (achievement_other.level = 0)
-                    "
-                /></q-item-label>
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-
-        <q-card
-          v-if="etc"
-          class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg"
-        >
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section class="q-ml-md">
-                <q-item-label>
-                  <q-input
-                    v-model="achievement_other.text"
-                    label="กรอกอื่นๆ"
-                    dense
-                    lazy-rules
-                    autogrow
-                    :disable="!status"
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
-                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                  />
-                </q-item-label>
-              </q-item-section>
-              <q-item-section side>
-                <q-rating
-                  v-model="achievement_other.level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :disable="!status"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                >
-                  <template v-slot:tip-1>
-                    <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-2>
-                    <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-3>
-                    <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-4>
-                    <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                  </template>
-                  <template v-slot:tip-5>
-                    <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                  </template>
-                </q-rating>
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-
-        <div class="text-top0 col-xs-12 col-sm-11 q-px-lg">
-          <div class="row col-12 justify-between q-pa-sm">
-            <div class="text-black">คะแนนรวมผลสัมฤทธิ์ของการทดลองฯ</div>
-            <div class="text-weight-bold text-black">{{ score1 }}</div>
-          </div>
-        </div>
-      </div>
-
-      <!-- Part 2 -->
-      <div class="row col-12 q-gutter-lg no-margin">
-        <div class="col-12 row">
-          <div class="col-12 text-top0 items-center">
-            <q-avatar class="bg-grey-2 q-mr-sm" size="28px">2</q-avatar>
-            พฤติกรรมของผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
-          </div>
-          <div class="col-12 text-top0 row items-center q-pl-md">
-            <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-            2.1 ความประพฤติ
-          </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
-            <q-list dense v-for="(list, i) in list2_1" :key="i">
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>{{ list.label }}</q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <q-rating
-                    v-model="conduct_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    :disable="!status"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                  >
-                    <template v-slot:tip-1>
-                      <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-2>
-                      <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-3>
-                      <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-4>
-                      <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-5>
-                      <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                    </template>
-                  </q-rating>
-                </q-item-section>
-              </q-item>
-              <q-separator class="q-my-xs" v-if="i + 1 < list2_1.length" />
-            </q-list>
-          </q-card>
-        </div>
-        <div class="col-12 row">
-          <div class="col-12 text-top0 row items-center q-pl-md">
-            <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-            2.2 ความมีคุณธรรมจริยธรรม
-          </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
-            <q-list dense v-for="(list, i) in list2_2" :key="i">
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>{{ list.label }}</q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <q-rating
-                    v-model="moral_level[i]"
-                    :val="list.id"
-                    :disable="!status"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                  >
-                    <template v-slot:tip-1>
-                      <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-2>
-                      <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-3>
-                      <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-4>
-                      <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-5>
-                      <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                    </template>
-                  </q-rating>
-                </q-item-section>
-              </q-item>
-              <q-separator class="q-my-xs" v-if="i + 1 < list2_2.length" />
-            </q-list>
-          </q-card>
-        </div>
-        <div class="col-12 row">
-          <div class="col-12 text-top0 row items-center q-pl-md">
-            <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-            2.3 การรักษาวินัย
-          </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
-            <q-list dense v-for="(list, i) in list2_3" :key="i">
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>{{ list.label }}</q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <q-rating
-                    v-model="discipline_level[i]"
-                    :val="list.id"
-                    :disable="!status"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                  >
-                    <template v-slot:tip-1>
-                      <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-2>
-                      <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-3>
-                      <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-4>
-                      <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-5>
-                      <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                    </template>
-                  </q-rating>
-                </q-item-section>
-              </q-item>
-              <q-separator class="q-my-xs" v-if="i + 1 < list2_3.length" />
-            </q-list>
-          </q-card>
-        </div>
-        <div class="col-12 row">
-          <div class="col-12 text-top0 row items-center q-pl-md">
-            <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-            2.4 อื่นๆ
-            <q-checkbox
-              class="q-ml-sm"
-              dense
-              v-model="etc2"
-              :disable="!status"
-              @click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
-            />
-          </div>
-          <q-card
-            v-if="etc2"
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
-            <q-list dense>
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>
-                    <q-input
-                      v-model="behavio_orther.text"
-                      label="กรอกอื่นๆ"
-                      dense
-                      lazy-rules
-                      :disable="!status"
-                      autogrow
-                      hide-bottom-space
-                      outlined
-                      class="bg-white"
-                      :rules="[
-                        (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                      ]"
-                    />
-                  </q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <q-rating
-                    v-model="behavio_orther.level"
-                    max="5"
-                    size="sm"
-                    :disable="!status"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                  >
-                    <template v-slot:tip-1>
-                      <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-2>
-                      <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-3>
-                      <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-4>
-                      <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
-                    </template>
-                    <template v-slot:tip-5>
-                      <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
-                    </template>
-                  </q-rating>
-                </q-item-section>
-              </q-item>
-            </q-list>
-          </q-card>
-        </div>
-        <div class="text-top0 col-xs-12 col-sm-11 q-pt-sm q-px-md q-my-none">
-          <div class="row col-12 justify-between q-py-sm">
-            <div class="text-black">คะแนนรวมพฤติกรรมการปฏิบัติราชการ</div>
-            <div class="text-weight-bold text-black">{{ score2 }}</div>
-          </div>
-        </div>
-      </div>
-      <!-- <Part2 /> -->
-
-      <!-- Part 3 -->
-      <!-- ผลการประเมิน -->
-      <div class="row col-12 q-pt-lg q-px-lg no-margin">
-        <div class="col-12 row justify-center">
-          <div class="col-12 text-top0 items-center">
-            <q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
-            ผลการประเมิน
-          </div>
-        </div>
-        <q-card class="text-top0 col-12">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label>
-                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  3.1.
-                  ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ</q-item-label
-                >
-              </q-item-section>
-              <q-item-section>
-                <q-item-label style="color: gray">
-                  <div class="row text-weight-light">
-                    <div class="col">คะแนน</div>
-                    <div class="col">ร้อยละ</div>
-                  </div>
-                </q-item-label>
-                <q-item-label caption style="color: #464444">
-                  <div class="row text-weight-bold">
-                    <div class="col">{{ score1 }}</div>
-                    <div class="col">{{ percent_score1 }}</div>
-                  </div>
-                </q-item-label>
-              </q-item-section>
-
-              <q-item-section side v-if="percent_score1 > 60">
-                ผ่าน (สูงกว่าร้อยละ 60)
-              </q-item-section>
-              <q-item-section side v-else>
-                ไม่ผ่าน (ต่ำกว่าร้อยละ 60)
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-        <q-card class="text-top0 col-12">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label>
-                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  3.2. พฤติกรรมของผู้ทดลองปฏิบัติบัติหน้าที่ราชการ</q-item-label
-                >
-              </q-item-section>
-              <q-item-section>
-                <q-item-label style="color: gray">
-                  <div class="row text-weight-light">
-                    <div class="col">คะแนน</div>
-                    <div class="col">ร้อยละ</div>
-                  </div>
-                </q-item-label>
-                <q-item-label caption style="color: #464444">
-                  <div class="row text-weight-bold">
-                    <div class="col">{{ score2 }}</div>
-                    <div class="col">{{ percent_score2 }}</div>
-                  </div>
-                </q-item-label>
-              </q-item-section>
-
-              <q-item-section side v-if="percent_score2 > 60">
-                ผ่าน (สูงกว่าร้อยละ 60)
-              </q-item-section>
-              <q-item-section side v-else>
-                ไม่ผ่าน (ต่ำกว่าร้อยละ 60)
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-        <q-card class="text-top0 col-12">
-          <q-list dense>
-            <q-item dense tag="label" v-ripple>
-              <q-item-section>
-                <q-item-label class="text-black"> ผลคะแนนรวม</q-item-label>
-              </q-item-section>
-              <q-item-section>
-                <q-item-label style="color: gray">
-                  <div class="row text-weight-light">
-                    <div class="col">คะแนน</div>
-                    <div class="col">ร้อยละ</div>
-                  </div>
-                </q-item-label>
-                <q-item-label caption style="color: #464444">
-                  <div class="row text-weight-bold">
-                    <div class="col">{{ score1 + score2 }}</div>
-                    <div class="col">{{ percent_sum }}</div>
-                  </div>
-                </q-item-label>
-              </q-item-section>
-
-              <q-item-section side v-if="percent_sum > 60">
-                ผ่าน (สูงกว่าร้อยละ 60)
-              </q-item-section>
-              <q-item-section side v-else>
-                ไม่ผ่าน (ต่ำกว่าร้อยละ 60)
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-card>
-      </div>
-
-      <!-- Part 4 -->
-      <div class="row col-12 q-pt-lg q-px-lg no-margin">
-        <div class="col-12 row justify-center">
-          <div class="col-12 text-top0 items-center">
-            <q-avatar class="bg-grey-2 q-mr-sm" size="28px">4</q-avatar>
-            การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
-          </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
-          >
-            <div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
-              <div class="row q-gutter-md q-pl-md">
-                <div class="col-8 text-weight-medium">หัวข้อ</div>
-                <div class="col">คะแนน</div>
-                <div class="col">ร้อยละ</div>
-              </div>
-            </div>
-            <q-separator class="q-my-xs" />
-            <div class="row q-gutter-md align-center q-pl-md">
-              <div class="col-8">1. การปฐมนิเทศ</div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="orientation"
-                />
-              </div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="orientation_percent"
-                />
-              </div>
-            </div>
-            <q-separator class="q-my-xs" />
-            <div class="row q-gutter-md align-center q-pl-md">
-              <div class="col-8">2. การเรียนรู้ด้วยตนเอง</div>
-              <div class="col">
-                <q-input
-                  dense
-                  outlined
-                  type="number"
-                  :disable="!status"
-                  v-model="self_learning"
-                />
-              </div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="self_learning_percent"
-                />
-              </div>
-            </div>
-            <q-separator class="q-my-xs" />
-            <div class="row q-gutter-md align-center q-pl-md">
-              <div class="col-8">3. การอบรมสัมนาร่วมกัน</div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="training_seminar"
-                />
-              </div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="training_seminar_percent"
-                />
-              </div>
-            </div>
-            <q-separator class="q-my-xs" />
-            <div class="row q-gutter-md align-center q-pl-md">
-              <div class="col-8">
-                4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)
-              </div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="other_training"
-                />
-              </div>
-              <div class="col">
-                <q-input
-                  outlined
-                  dense
-                  type="number"
-                  :disable="!status"
-                  v-model="other_training_percent"
-                />
-              </div>
-            </div>
-            <q-separator class="q-my-xs" />
-            <div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
-              <div class="row q-gutter-md q-pl-sm">
-                <div class="col-8 text-weight-medium">
-                  <q-item-label> ผลคะแนนรวม</q-item-label>
-                </div>
-                <div class="col q-pl-md">{{ score4 }}</div>
-                <div class="col q-pl-md">{{ score5 }}</div>
-              </div>
-            </div>
-            <!-- <q-list dense>
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>1. การปฐมนิเทศ</q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="orientation"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="orientation"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                    />
-                  </div>
-                </q-item-section>
-              </q-item>
-              <q-separator class="q-my-xs" />
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>2. การเรียนรู้ด้วยตนเอง</q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="self_learning"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="self_learning"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                    />
-                  </div>
-                </q-item-section>
-              </q-item>
-              <q-separator class="q-my-xs" />
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label>3. การอบรมสัมนาร่วมกัน</q-item-label>
-                </q-item-section>
-                <q-item-section side>
-                  <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="training_seminar"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="training_seminar"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                    />
-                  </div>
-                </q-item-section>
-              </q-item>
-              <q-separator class="q-my-xs" />
-              <q-item dense tag="label" v-ripple>
-                <q-item-section>
-                  <q-item-label
-                    >4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)</q-item-label
-                  >
-                </q-item-section>
-                <q-item-section side>
-                  <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="other_training"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="other_training"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                    />
-                  </div>
-                </q-item-section>
-              </q-item>
-            </q-list> -->
-          </q-card>
-        </div>
-      </div>
-
-      <div class="row col-12 q-gutter-lg no-margin justify-center">
-        <div class="col-xs-12 col-sm-11 row justify-center">
-          <div class="col-12 text-top0 items-center">
-            <!-- <q-avatar class="bg-grey-2 q-mr-sm" size="28px">5</q-avatar> -->
-            สรุปผลการพัฒนา
-          </div>
-          <div class="col-12">
-            <q-select
-              :disable="!status"
-              class="col-xs-12"
-              dense
-              v-model="develop_result"
-              outlined
-              :options="develop_result_option"
-              option-label="name"
-              option-value="value"
-              label="เลือกสรุปผลการพัฒนา"
-              map-options
-              emit-value
-            />
-          </div>
-        </div>
-      </div>
-
-      <div class="row col-12 q-gutter-lg no-margin justify-center">
-        <div class="col-xs-12 col-sm-11 row justify-center">
-          <div class="col-12 text-top0 items-center">
-            <!-- <q-avatar class="bg-grey-2 q-mr-sm" size="28px">5</q-avatar> -->
-            สรุปผล การประเมินผลทดลองปฏิบัติหน้าที่ราชการ
-          </div>
-          <div class="col-12">
-            <q-select
-              :disable="!status"
-              class="col-xs-12"
-              dense
-              v-model="evaluate_result"
-              outlined
-              :options="evaluate_result_option"
-              option-label="name"
-              option-value="value"
-              label="เลือกสรุปผล การประเมินผลทดลองปฏิบัติหน้าที่ราชการ"
-              map-options
-              emit-value
-            />
-          </div>
-        </div>
-      </div>
-
-      <!-- Footer -->
-      <!-- <Footer /> -->
-      <div class="row col-12 q-gutter-lg no-margin justify-center">
-        <div class="col-xs-12 col-sm-11">
-          <div class="col-12 text-top2 row items-center">
-            ผู้บังคับบัญชาผู้มอบหมายงาน
-          </div>
-          <div class="col-12 row q-col-gutter-md">
-            <q-select
-              class="col-xs-12 col-sm-8"
-              dense
-              v-model="commander.name"
-              outlined
-              label="ผู้บังคับบัญชา"
-              disable
-            />
-            <div class="col-xs-12 col-sm-4">
-              <datepicker
-                menu-class-name="modalfix"
-                v-model="commander.dated"
-                :locale="'th'"
-                autoApply
-                borderless
-                :readonly="!status"
-                :enableTimePicker="false"
-                week-start="0"
-              >
-                <template #year="{ year }">
-                  {{ year + 543 }}
-                </template>
-                <template #year-overlay-value="{ value }">
-                  {{ parseInt(value + 543) }}
-                </template>
-                <template #trigger>
-                  <q-input
-                    outlined
-                    dense
-                    :disable="!status"
-                    hide-bottom-space
-                    class="full-width datepicker col-3"
-                    :model-value="
-                      commander.dated != null
-                        ? date2Thai(commander.dated)
-                        : null
-                    "
-                    :label="`${'ลงวันที่'}`"
-                    :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon
-                        name="event"
-                        class="cursor-pointer"
-                        style="color: var(--q-primary)"
-                      >
-                      </q-icon>
-                    </template>
-                  </q-input>
-                </template>
-              </datepicker>
-            </div>
-
-            <!-- <q-select
-              class="col-xs-12 col-sm-8"
-              dense
-              v-model="mentors[0].name"
-              outlined
-              label="ผู้บังคับบัญชา"
-              disable
-            /> -->
-            <!-- <div class="col-xs-12 col-sm-4">
-              <datepicker
-                menu-class-name="modalfix"
-                v-model="dateAutherise"
-                :locale="'th'"
-                autoApply
-                borderless
-                :readonly="!status"
-                :enableTimePicker="false"
-                week-start="0"
-              >
-                <template #year="{ year }">
-                  {{ year + 543 }}
-                </template>
-                <template #year-overlay-value="{ value }">
-                  {{ parseInt(value + 543) }}
-                </template>
-                <template #trigger>
-                  <q-input
-                    outlined
-                    :disable="!status"
-                    dense
-                    class="full-width datepicker col-3"
-                    hide-bottom-space
-                    :model-value="
-                      dateAutherise != null ? date2Thai(dateAutherise) : null
-                    "
-                    :label="`${'ลงวันที่'}`"
-                    :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon
-                        name="event"
-                        class="cursor-pointer"
-                        style="color: var(--q-primary)"
-                      >
-                      </q-icon>
-                    </template>
-                  </q-input>
-                </template>
-              </datepicker>
-            </div> -->
-
-            <!-- <q-select
-              class="col-xs-12 col-sm-8"
-              dense
-              v-model="mentors[1].name"
-              outlined
-              label="ผู้บังคับบัญชา"
-              disable
-            /> -->
-            <!-- <div class="col-xs-12 col-sm-4">
-              <datepicker
-                menu-class-name="modalfix"
-                v-model="dateAutherise"
-                :locale="'th'"
-                autoApply
-                borderless
-                :readonly="!status"
-                :enableTimePicker="false"
-                week-start="0"
-              >
-                <template #year="{ year }">
-                  {{ year + 543 }}
-                </template>
-                <template #year-overlay-value="{ value }">
-                  {{ parseInt(value + 543) }}
-                </template>
-                <template #trigger>
-                  <q-input
-                    outlined
-                    dense
-                    :disable="!status"
-                    class="full-width datepicker col-3"
-                    hide-bottom-space
-                    :model-value="
-                      dateAutherise != null ? date2Thai(dateAutherise) : null
-                    "
-                    :label="`${'ลงวันที่'}`"
-                    :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon
-                        name="event"
-                        class="cursor-pointer"
-                        style="color: var(--q-primary)"
-                      >
-                      </q-icon>
-                    </template>
-                  </q-input>
-                </template>
-              </datepicker> -->
-            <!-- </div> -->
-          </div>
-          <div
-            class="col-12 row q-col-gutter-md q-mt-sm"
-            v-for="(mentor, index) in mentors"
-          >
-            <q-select
-              :key="index"
-              class="col-xs-12 col-sm-8"
-              hide-bottom-space
-              dense
-              v-model="mentors[index].name"
-              outlined
-              label="ผู้บังคับบัญชา"
-              disable
-            />
-            <datepicker
-              class="col-xs-12 col-sm-4"
-              :readonly="!status"
-              menu-class-name="modalfix"
-              v-model="mentors[index].dated"
-              :locale="'th'"
-              autoApply
-              borderless
-              :enableTimePicker="false"
-              week-start="0"
-            >
-              <template #year="{ year }">
-                {{ year + 543 }}
-              </template>
-              <template #year-overlay-value="{ value }">
-                {{ parseInt(value + 543) }}
-              </template>
-              <template #trigger>
-                <q-input
-                  hide-bottom-space
-                  outlined
-                  dense
-                  class="full-width datepicker col-3"
-                  :model-value="
-                    mentors[index].dated != null
-                      ? date2Thai(mentors[index].dated)
-                      : null
-                  "
-                  :label="`${'ลงวันที่'}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                >
-                  <template v-slot:prepend>
-                    <q-icon
-                      name="event"
-                      class="cursor-pointer"
-                      style="color: var(--q-primary)"
-                    >
-                    </q-icon>
-                  </template>
-                </q-input>
-              </template>
-            </datepicker>
-          </div>
-        </div>
-      </div>
-
-      <div class="row col-12 q-gutter-lg no-margin justify-center">
-        <div class="col-xs-12 col-sm-11">
-          <div class="col-12 text-top2 row items-center">คณะกรรมการ</div>
-          <div class="col-12 row q-col-gutter-md">
-            <q-select
-              class="col-xs-12 col-sm-8"
-              dense
-              v-model="chairman.name"
-              outlined
-              label="คณะกรรมการ"
-              disable
-            />
-            <div class="col-xs-12 col-sm-4">
-              <datepicker
-                menu-class-name="modalfix"
-                v-model="dateAutherise"
-                :locale="'th'"
-                autoApply
-                borderless
-                :enableTimePicker="false"
-                :readonly="!status"
-                week-start="0"
-              >
-                <template #year="{ year }">
-                  {{ year + 543 }}
-                </template>
-                <template #year-overlay-value="{ value }">
-                  {{ parseInt(value + 543) }}
-                </template>
-                <template #trigger>
-                  <q-input
-                    outlined
-                    :disable="!status"
-                    dense
-                    class="full-width datepicker col-3"
-                    :model-value="
-                      dateAutherise != null ? date2Thai(dateAutherise) : null
-                    "
-                    :label="`${'ลงวันที่'}`"
-                    :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon
-                        name="event"
-                        class="cursor-pointer"
-                        style="color: var(--q-primary)"
-                      >
-                      </q-icon>
-                    </template>
-                  </q-input>
-                </template>
-              </datepicker>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <q-toolbar
-        class="text-primary"
-        v-if="routeName == 'probationFormAddevaluascore'"
-      >
-        <q-space />
-        <q-btn label="บันทึก" color="secondary" @click="savaForm" />
-      </q-toolbar>
-    </div>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.align-center {
-  display: flex;
-
-  align-items: center;
-  /* จัดเนื้อหาให้อยู่กลางแนวตั้ง */
-}
-
-.text-top2 {
-  font-weight: 500;
-  padding-bottom: 8px;
-  color: rgb(70, 68, 68);
-}
-
-.text-top0 {
-  font-weight: 600;
-  padding-bottom: 8px;
-  color: rgb(70, 68, 68);
-}
-
-.q-rating__icon {
-  text-shadow: transparent !important;
-}
-
-.q-card {
-  box-shadow: 0px 0px 0px 0px !important;
-}
-</style>
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResult.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResult.vue
index 6c33d5b84..70929401f 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResult.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResult.vue
@@ -90,15 +90,17 @@ const fecthFormdata = async () => {
       await fecthAssignoutput(res.data.data);
       await fectFormfull();
     })
-    .catch((e: any) => {})
+    .catch((e: any) => { })
     .finally(() => {
       if (props.action == "edit") {
         fecthFormRound();
       }
     });
 };
+
 const fectFormfull = async () => {
-  Autherise.value = probationStore.director.name;
+  Autherise.value = probationStore.director.name + ` (${probationStore.director.PositionLineName}, ${probationStore.director.PositionLevelName}, ${probationStore.director.Oc})`;
+
   list1_1.value = probationStore.assignOutput;
   evaluate_expenct_level.value = await probationStore.assignOutput.map(
     (e: any) => ({
@@ -112,6 +114,7 @@ const fectFormfull = async () => {
   checkArray.value = list1_1.value.length;
   fecthFormRound();
 };
+
 const fecthFormRound = async () => {
   try {
     let data = await dataArr.value;
@@ -332,14 +335,7 @@ onMounted(async () => {
     <div class="toptitle text-dark col-12 row items-center q-gutter-md">
       <div>แบบบันทึกผล (ผู้ดูเเล)</div>
       <div v-if="status == false">
-        <q-btn
-          dense
-          flat
-          round
-          color="primary"
-          @click="edit()"
-          icon="mdi-pencil-outline"
-        >
+        <q-btn dense flat round color="primary" @click="edit()" icon="mdi-pencil-outline">
           <q-tooltip>แก้ไขข้อมูล</q-tooltip>
         </q-btn>
       </div>
@@ -347,24 +343,32 @@ onMounted(async () => {
         <q-btn dense flat round color="red" @click="cancel()" icon="mdi-undo">
           <q-tooltip>ยกเลิก</q-tooltip>
         </q-btn>
-        <q-btn
-          dense
-          flat
-          round
-          class="q-ml-md"
-          color="public"
-          @click="savaForm()"
-          icon="mdi-content-save-outline"
-        >
+        <q-btn dense flat round class="q-ml-md" color="public" @click="savaForm()" icon="mdi-content-save-outline">
           <q-tooltip>บันทึกข้อมูล</q-tooltip>
         </q-btn>
       </div>
     </div>
     <div class="col-12 row q-gutter-lg">
       <div class="col-12 row">
+        <div class="col-12 row text-top0">
+          <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+          ผู้ทดลองปฏิบัติหน้าที่ราชการ {{ probationStore.person.name }}
+        </div>
+
+        <div class="col-12 q-pl-md q-pb-md">
+          <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+          <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span> {{
+            probationStore.person.PositionLineName }}</div>
+          <div class="col-12"><span class="text-top0 q-pl-sm">ระดับ</span> {{ probationStore.person.PositionLevelName }}
+          </div>
+          <div class="col-12"><span class="text-top0 q-pl-sm">สังกัด</span> {{ probationStore.person.Oc }}</div>
+        </div>
+
         <div class="col-12 text-top0 row items-center">
           <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          วันเริ่มทดลองปฏิบัติหน้าที่ราชการ ตั้งแต่วันที่
+          การทดลองปฎิบัติหน้าที่ราชการ<span class="text-primary q-pr-sm">{{
+                "ครั้งที่ " + assign.round_no
+              }}</span> ตั้งแต่วันที่
           <span class="text-black q-px-sm">
             {{ date2Thai(assign.date_start) }}
           </span>
@@ -375,7 +379,7 @@ onMounted(async () => {
         </div>
         <div class="col-12 text-top0 row items-center">
           <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          <span class="text-primary q-pr-sm">
+          บันทึกผล<span class="text-primary q-pr-sm">
             {{ "ครั้งที่ " + evaluate_no }}
           </span>
           ระหว่างวันที่
@@ -408,27 +412,15 @@ onMounted(async () => {
         <div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
           ผลผลิตของงานที่คาดหวัง
         </div>
-        <q-card
-          flat
-          bordered
-          class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-        >
+        <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
           <q-list dense v-for="(list, i) in list1_1" :key="i">
             <q-item dense tag="label" v-ripple>
               <q-item-section>
                 <q-item-label>{{ list.output_desc }}</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="evaluate_expenct_level[i].level"
-                  :val="list.id"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="evaluate_expenct_level[i].level" :val="list.id" max="5" size="sm" color="grey"
+                  :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -455,37 +447,16 @@ onMounted(async () => {
         <div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
           ผลผลิตของงานที่เกิดขึ้นจริง
         </div>
-        <q-card
-          flat
-          bordered
-          class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-        >
+        <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
           <q-list dense v-for="(list, i) in list1_2" :key="i">
             <q-item dense tag="label" v-ripple v-if="i < checkArray">
               <q-item-section>
-                <q-input
-                  outlined
-                  dense
-                  v-model="evaluate_ouptut[i].text"
-                  lazy-rules
-                  autogrow
-                  hide-bottom-space
-                  :row="1"
-                  :rules="evaluate_ouptutRules"
-                  :disable="!status"
-                />
+                <q-input outlined dense v-model="evaluate_ouptut[i].text" lazy-rules autogrow hide-bottom-space :row="1"
+                  :rules="evaluate_ouptutRules" :disable="!status" />
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="evaluate_ouptut[i].level"
-                  :val="list.id"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="evaluate_ouptut[i].level" :val="list.id" max="5" size="sm" color="grey"
+                  :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -515,19 +486,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.2. ความรู้ความสามารถ</q-item-label
-                >
+                  1.2. ความรู้ความสามารถ</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="knowledge_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="knowledge_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -555,19 +518,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.3. ทักษะ</q-item-label
-                >
+                  1.3. ทักษะ</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="skill_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="skill_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -595,19 +550,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.4. สมมรถนะ</q-item-label
-                >
+                  1.4. สมมรถนะ</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="competency_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="competency_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -635,19 +582,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.5. ความสามารถในการเรียนรู้งาน</q-item-label
-                >
+                  1.5. ความสามารถในการเรียนรู้งาน</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="learn_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="learn_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -676,19 +615,11 @@ onMounted(async () => {
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   1.6.
-                  ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label
-                >
+                  ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="apply_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="apply_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -716,55 +647,29 @@ onMounted(async () => {
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   1.7 อื่นๆ
-                  <q-checkbox
-                    class="q-ml-sm"
-                    dense
-                    v-model="etc"
-                    @click="
-                      (achievement_other.text = ''),
-                        (achievement_other.level = 0)
-                    "
-                    :disable="!status"
-                /></q-item-label>
+                  <q-checkbox class="q-ml-sm" dense v-model="etc" @click="
+                    (achievement_other.text = ''),
+                    (achievement_other.level = 0)
+                    " :disable="!status" /></q-item-label>
               </q-item-section>
             </q-item>
           </q-list>
         </q-card>
 
-        <q-card
-          v-if="etc"
-          class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg"
-        >
+        <q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
           <q-list dense>
             <q-item dense tag="label" v-ripple>
               <q-item-section class="q-ml-md">
                 <q-item-label>
-                  <q-input
-                    v-model="achievement_other.text"
-                    label="กรอกอื่นๆ"
-                    dense
-                    lazy-rules
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space
+                    outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                    :disable="!status"
-                  />
+                    ]" :disable="!status" />
                 </q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="achievement_other.level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="achievement_other.level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -793,39 +698,18 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             จุดเด่น (ไม่เกิน 5 บรรทัด)
           </div>
-          <q-input
-            outlined
-            dense
-            v-model="achievement_strength_desc"
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-            lazy-rules
-            type="textarea"
-            label="กรอกจุดเด่น"
-            hide-bottom-space
-            :row="5"
-            :rules="achievement_strengthRules"
-            ref="achievement_strengthRef"
-            :disable="!status"
-          />
+          <q-input outlined dense v-model="achievement_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+            lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="achievement_strengthRules"
+            ref="achievement_strengthRef" :disable="!status" />
         </div>
         <div class="col-12 row">
           <div class="col-12 text-top0 row items-center q-pl-lg">
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
           </div>
-          <q-input
-            outlined
-            dense
-            v-model="achievement_improve_desc"
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-            lazy-rules
-            type="textarea"
-            hide-bottom-space
-            label="กรอกสิ่งที่ควรปรับปรุง"
-            :row="5"
-            ref="achievement_inproveRef"
-            :disable="!status"
-          />
+          <q-input outlined dense v-model="achievement_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+            lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5"
+            ref="achievement_inproveRef" :disable="!status" />
         </div>
       </div>
       <div class="row col-12 q-gutter-lg no-margin">
@@ -838,27 +722,15 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.1 ความประพฤติ
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense v-for="(list, i) in list2_1" :key="i">
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>{{ list.label }}</q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="conduct_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="conduct_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                    :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -886,27 +758,15 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.2 ความมีคุณธรรมจริยธรรม
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense v-for="(list, i) in list2_2" :key="i">
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>{{ list.label }}</q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="moral_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="moral_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                    :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -934,27 +794,15 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.3 การรักษาวินัย
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense v-for="(list, i) in list2_3" :key="i">
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>{{ list.label }}</q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="discipline_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="discipline_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                    :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -981,50 +829,23 @@ onMounted(async () => {
           <div class="col-12 text-top0 row items-center q-pl-lg">
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.4 อื่นๆ
-            <q-checkbox
-              class="q-ml-sm"
-              dense
-              v-model="etc2"
-              @click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
-              :disable="!status"
-            />
+            <q-checkbox class="q-ml-sm" dense v-model="etc2"
+              @click="(behavio_orther.text = ''), (behavio_orther.level = 0)" :disable="!status" />
           </div>
-          <q-card
-            v-if="etc2"
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense>
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>
-                    <q-input
-                      v-model="behavio_orther.text"
-                      label="กรอกอื่นๆ"
-                      dense
-                      lazy-rules
-                      autogrow
-                      hide-bottom-space
-                      outlined
-                      class="bg-white"
-                      :rules="[
+                    <q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space
+                      outlined class="bg-white" :rules="[
                         (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                      ]"
-                      :disable="!status"
-                    />
+                      ]" :disable="!status" />
                   </q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="behavio_orther.level"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="behavio_orther.level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                    label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -1052,39 +873,18 @@ onMounted(async () => {
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
               จุดเด่น (ไม่เกิน 5 บรรทัด)
             </div>
-            <q-input
-              outlined
-              dense
-              v-model="behavior_strength_desc"
-              class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-              lazy-rules
-              type="textarea"
-              label="กรอกจุดเด่น"
-              hide-bottom-space
-              :row="5"
-              :rules="behavio_strengthRules"
-              ref="behavio_strengthRef"
-              :disable="!status"
-            />
+            <q-input outlined dense v-model="behavior_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+              lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="behavio_strengthRules"
+              ref="behavio_strengthRef" :disable="!status" />
           </div>
           <div class="col-12 row">
             <div class="col-12 text-top0 row items-center q-pl-lg">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
               สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
             </div>
-            <q-input
-              outlined
-              dense
-              v-model="behavior_improve_desc"
-              class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-              lazy-rules
-              type="textarea"
-              hide-bottom-space
-              label="กรอกสิ่งที่ควรปรับปรุง"
-              :row="5"
-              ref="behavio_inproveRef"
-              :disable="!status"
-            />
+            <q-input outlined dense v-model="behavior_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+              lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5"
+              ref="behavio_inproveRef" :disable="!status" />
           </div>
         </div>
       </div>
@@ -1094,11 +894,7 @@ onMounted(async () => {
             <q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
             การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
             <q-list dense>
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
@@ -1106,22 +902,10 @@ onMounted(async () => {
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="orientation"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="orientation"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
@@ -1132,22 +916,10 @@ onMounted(async () => {
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="self_learning"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="self_learning"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
@@ -1158,50 +930,24 @@ onMounted(async () => {
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="training_seminar"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="training_seminar"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
               <q-separator class="q-my-xs" />
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
-                  <q-item-label
-                    >4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)</q-item-label
-                  >
+                  <q-item-label>4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)</q-item-label>
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="other_training"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="other_training"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
@@ -1215,27 +961,11 @@ onMounted(async () => {
             ผู้บังคับบัญชา/ผู้มอบหมายงาน
           </div>
           <div class="col-12 row q-col-gutter-md">
-            <q-select
-              class="col-xs-12 col-sm-8"
-              dense
-              v-model="Autherise"
-              outlined
-              :options="option"
-              label="ผู้บังคับบัญชา"
-              option-label="name"
-              disable
-            />
+            <q-select class="col-xs-12 col-sm-8" dense v-model="Autherise" outlined :options="option"
+              label="ผู้บังคับบัญชา" option-label="name" disable />
             <div class="col-xs-12 col-sm-4">
-              <datepicker
-                menu-class-name="modalfix"
-                v-model="dateAutherise"
-                :locale="'th'"
-                autoApply
-                borderless
-                :enableTimePicker="false"
-                week-start="0"
-                :readonly="!status"
-              >
+              <datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
+                :enableTimePicker="false" week-start="0" :readonly="!status">
                 <template #year="{ year }">
                   {{ year + 543 }}
                 </template>
@@ -1243,23 +973,11 @@ onMounted(async () => {
                   {{ parseInt(value + 543) }}
                 </template>
                 <template #trigger>
-                  <q-input
-                    outlined
-                    dense
-                    class="full-width datepicker col-3"
-                    :model-value="
-                      dateAutherise != null ? date2Thai(dateAutherise) : null
-                    "
-                    :label="`${'ลงวันที่'}`"
-                    :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                    :disable="!status"
-                  >
+                  <q-input outlined dense class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
+                    " :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
+                    :disable="!status">
                     <template v-slot:prepend>
-                      <q-icon
-                        name="event"
-                        class="cursor-pointer"
-                        style="color: var(--q-primary)"
-                      >
+                      <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
                       </q-icon>
                     </template>
                   </q-input>
@@ -1269,10 +987,7 @@ onMounted(async () => {
           </div>
         </div>
       </div>
-      <q-toolbar
-        class="text-primary"
-        v-if="routeName == 'probationFormAddresult'"
-      >
+      <q-toolbar class="text-primary" v-if="routeName == 'probationFormAddresult'">
         <q-space />
         <q-btn label="บันทึก" color="secondary" @click="savaForm" />
       </q-toolbar>
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue
index f7811488f..5b3884715 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue
@@ -40,9 +40,11 @@ const checkArray = ref<number>(0);
 const alerts = Array(20)
   .fill(null)
   .map(() => ref<boolean>(false));
+
 onMounted(async () => {
   await fecthFormdata(assignId.value);
 });
+
 const fecthFormdata = async (id: string) => {
   await http
     .get(config.API.formevaluateRecord(id))
@@ -55,7 +57,7 @@ const fecthFormdata = async (id: string) => {
       person.value = res.data.data.person;
       assign.value = res.data.data.assign;
       option.value.push(res.data.data.director);
-      Autherise.value = res.data.data.director.name;
+      Autherise.value = res.data.data.director.name + ` (${res.data.data.director.PositionLineName}, ${res.data.data.director.PositionLevelName}, ${res.data.data.director.Oc})`;
 
       list1_1.value = res.data.data.assign_output;
       res.data.data.assign_output.forEach((e: any) => {
@@ -73,15 +75,10 @@ const fecthFormdata = async (id: string) => {
       }));
       checkArray.value = list1_1.value.length;
     })
-    .catch((e: any) => {});
+    .catch((e: any) => { });
 };
 
 const list1_1 = ref<any>([
-  // { id: "1", label: "ผลผลิตของงานที่คาดหวัง 1" },
-  // { id: "2", label: "ผลผลิตของงานที่คาดหวัง 2" },
-  // { id: "3", label: "ผลผลิตของงานที่คาดหวัง 3" },
-  // { id: "4", label: "ผลผลิตของงานที่คาดหวัง 4" },
-  // { id: "5", label: "ผลผลิตของงานที่คาดหวัง 5" },
 ]);
 const list1_2 = [{ id: "", label: "" }];
 
@@ -91,19 +88,10 @@ const list2_3 = probationStore.behavior_no3;
 
 const option = ref<any>([]);
 
-const dateToday = ref<Date>(new Date("10-10-2023"));
-const dateEnd = ref<Date>(new Date("12-10-2023"));
-const period = ref<number>(1);
-
 // part 1
 const evaluate_expenct_level = ref<any>([]);
 
 const evaluate_ouptut = ref<any>([
-  // { level: 0, text: "" },
-  // { level: 0, text: "" },
-  // { level: 0, text: "" },
-  // { level: 0, text: "" },
-  // { level: 0, text: "" },
 ]);
 const knowledge_level = ref<number>(0);
 const skill_level = ref<number>(0);
@@ -113,8 +101,6 @@ const apply_level = ref<number>(0);
 const success_level = ref<number>(0);
 const etc = ref<any>(false); // checkBox 1.8
 const achievement_other = ref<any>({ text: "", level: 0 });
-// const etc_text = ref<string>("");
-// const ext_value = ref<number>(0);
 const achievement_strength_desc = ref<string>("");
 const achievement_improve_desc = ref<string>("");
 // part 2
@@ -123,8 +109,6 @@ const moral_level = ref<any>([]);
 const discipline_level = ref<any>([]);
 const etc2 = ref<any>(false); // checkBox 2.4
 const behavio_orther = ref<any>({ text: "", level: 0 });
-// const etc_text2 = ref<string>("");
-// const ext_value2 = ref<number>(0);
 const behavior_strength_desc = ref<string>("");
 const behavior_improve_desc = ref<string>("");
 // part 3
@@ -144,18 +128,11 @@ const achievement_strengthRef = ref<any>(null);
 const achievement_strengthRules = [
   (val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลจุดเด่น",
 ];
-const achievement_inproveRef = ref<any>(null);
-const achievement_inproveRules = [
-  (val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลสิ่งที่ควรปรับปรุง",
-];
 const behavio_strengthRef = ref<any>(null);
 const behavio_strengthRules = [
   (val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลจุดเด่น",
 ];
-const behavio_inproveRef = ref<any>(null);
-const behavio_inproveRules = [
-  (val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลสิ่งที่ควรปรับปรุง",
-];
+
 const lengthconduct = computed(() => {
   return conduct_level.value.filter((item: number) => item !== 0).length;
 });
@@ -186,23 +163,13 @@ const variablesToWatch = [
 const ArrayCountbotton = [orientation, self_learning, training_seminar];
 const savaForm = () => {
   achievement_strengthRef.value.validate();
-  // achievement_inproveRef.value.validate();
   behavio_strengthRef.value.validate();
-  // behavio_inproveRef.value.validate();
 
   let hasError = false;
-  // const filterlevel1_1 = evaluate_expenct_level.value.filter(
-  //   (e: any) => e.level == 0
-  // );
-  // const filter_ouptut1_2 = evaluate_ouptut.value.filter(
-  //   (e: any) => e.level == 0 || e.text == ""
-  // );
 
   if (
-    // filterlevel1_1.length != 0 ||
-    // filter_ouptut1_2.length != 0 ||
     lengthevaluate_expenct_level.value !==
-      evaluate_expenct_level.value.length ||
+    evaluate_expenct_level.value.length ||
     lengthevaluate_ouptut.value !== evaluate_ouptut.value.length ||
     knowledge_level.value === 0 ||
     skill_level.value === 0 ||
@@ -211,12 +178,10 @@ const savaForm = () => {
     apply_level.value === 0 ||
     success_level.value === 0 ||
     achievement_strength_desc.value === "" ||
-    // achievement_improve_desc.value === "" ||
     lengthconduct.value !== 4 ||
     lengthmoral_level.value !== 3 ||
     lengthdiscipline_level.value !== 5 ||
     behavior_strength_desc.value === "" ||
-    // behavior_improve_desc.value === "" ||
     orientation.value === null ||
     self_learning.value === null ||
     training_seminar.value === null
@@ -265,7 +230,6 @@ const savaForm = () => {
         alerts[index + 11].value = true;
       }
     });
-    console.log(evaluate_expenct_level.value);
 
     dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
   } else {
@@ -287,8 +251,6 @@ const putformData = () => {
     apply_level: apply_level.value,
     success_level: success_level.value,
     achievement_other: achievement_other.value,
-    // achievement_other_desc: etc_text.value,
-    // achievement_other_level: ext_value.value,
     achievement_strength_desc: achievement_strength_desc.value,
     achievement_improve_desc: achievement_improve_desc.value,
     conduct1_level: conduct_level.value[0],
@@ -303,8 +265,6 @@ const putformData = () => {
     discipline3_level: discipline_level.value[2],
     discipline4_level: discipline_level.value[3],
     discipline5_level: discipline_level.value[4],
-    // behavio_orther_desc: etc_text2.value,
-    // behavio_orther_level: ext_value2.value,
     behavio_orther: behavio_orther.value,
     behavior_strength_desc: behavior_strength_desc.value,
     behavior_improve_desc: behavior_improve_desc.value,
@@ -313,7 +273,6 @@ const putformData = () => {
     training_seminar: Number(training_seminar.value),
     other_training: Number(other_training.value),
     assessor_dated: dateToISO(dateAutherise.value),
-    // commander_dated: dateAutherise.value,
   };
   dialogConfirm($q, async () => await saveformdata(data));
 };
@@ -346,13 +305,11 @@ ArrayCountbotton.forEach((variable, index) => {
 });
 watch(lengthevaluate_expenct_level, (newLength) => {
   if (newLength === evaluate_expenct_level.value.length) {
-    console.log(true);
     alerts[0].value = false;
   }
 });
 watch(lengthevaluate_ouptut, (newLength) => {
   if (newLength === evaluate_ouptut.value.length) {
-    console.log(true);
     alerts[1].value = false;
   }
 });
@@ -381,19 +338,8 @@ const getBordered = (i: boolean) => {
 <template>
   <q-card class="my-card" flat bordered>
     <q-toolbar>
-      <div
-        class="text-h6 text-weight-medium text-dark col-12 row items-center q-py-md"
-      >
-        <q-btn
-          icon="mdi-arrow-left"
-          unelevated
-          round
-          dense
-          flat
-          color="primary"
-          class="q-mr-sm"
-          @click="router.go(-1)"
-        />
+      <div class="text-h6 text-weight-medium text-dark col-12 row items-center q-py-md">
+        <q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
         การทดลองปฏิบัติหน้าที่ราชการของ {{ person.name }}
       </div>
     </q-toolbar>
@@ -402,9 +348,23 @@ const getBordered = (i: boolean) => {
       <div class="row col-12 no-margin q-px-md q-pt-md">
         <div class="row col-12 q-gutter-lg">
           <div class="col-12 row">
+            <div class="col-12 row text-top0">
+              <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+              ผู้ทดลองปฏิบัติหน้าที่ราชการ {{person.name}}
+            </div>
+
+            <div class="col-12 q-pl-md q-pb-md">
+              <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+              <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span> {{ person.PositionLineName }}</div>
+              <div class="col-12"><span class="text-top0 q-pl-sm">ระดับ</span> {{ person.PositionLevelName }} </div>
+              <div class="col-12"><span class="text-top0 q-pl-sm">สังกัด</span> {{ person.Oc }}</div>
+            </div>
+
             <div class="col-12 text-top0 row items-center">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-              วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
+              การทดลองปฎิบัติหน้าที่ราชการ<span class="text-primary q-pr-sm">{{
+                "ครั้งที่ " + assign.round_no
+              }}</span> ตั้งแต่วันที่
               <span class="text-black q-px-sm">{{
                 date2Thai(assign.date_start)
               }}</span>
@@ -415,7 +375,7 @@ const getBordered = (i: boolean) => {
             </div>
             <div class="col-12 text-top0 row items-center">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-              <span class="text-primary q-pr-sm">{{
+              บันทึกผล<span class="text-primary q-pr-sm">{{
                 "ครั้งที่ " + round
               }}</span>
               ระหว่างวันที่
@@ -448,29 +408,18 @@ const getBordered = (i: boolean) => {
             <div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
               ผลผลิตของงานที่คาดหวัง
             </div>
-            <q-card
-              flat
-              bordered
-              :class="[
-                'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
-                getBordered(alerts[0].value),
-              ]"
-            >
+            <q-card flat bordered :class="[
+                  'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
+                  getBordered(alerts[0].value),
+                ]">
               <q-list dense v-for="(list, i) in list1_1" :key="i">
                 <q-item dense tag="label" v-ripple>
                   <q-item-section>
                     <q-item-label>{{ list.output_desc }}</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="evaluate_expenct_level[i].level"
-                      :val="list.id"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="evaluate_expenct_level[i].level" :val="list.id" max="5" size="sm" color="grey"
+                      :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -497,40 +446,20 @@ const getBordered = (i: boolean) => {
             <div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
               ผลผลิตของงานที่เกิดขึ้นจริง
             </div>
-            <q-card
-              flat
-              bordered
-              :class="[
-                'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
-                getBordered(alerts[1].value),
-              ]"
-            >
+            <q-card flat bordered :class="[
+              'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
+              getBordered(alerts[1].value),
+            ]">
               <q-list dense v-for="(list, i) in list1_2" :key="i">
                 <q-item dense tag="label" v-ripple v-if="i < checkArray">
                   <q-item-section>
                     <!-- <q-item-label>{{ list.label }}</q-item-label> -->
-                    <q-input
-                      outlined
-                      dense
-                      v-model="evaluate_ouptut[i].text"
-                      lazy-rules
-                      autogrow
-                      label="ผลผลิตของงานที่เกิดขึ้นจริง"
-                      hide-bottom-space
-                      :row="1"
-                      :rules="evaluate_ouptutRules"
-                    />
+                    <q-input outlined dense v-model="evaluate_ouptut[i].text" lazy-rules autogrow
+                      label="ผลผลิตของงานที่เกิดขึ้นจริง" hide-bottom-space :row="1" :rules="evaluate_ouptutRules" />
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="evaluate_ouptut[i].level"
-                      :val="list.id"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="evaluate_ouptut[i].level" :val="list.id" max="5" size="sm" color="grey"
+                      :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -557,27 +486,15 @@ const getBordered = (i: boolean) => {
           <div class="col-12 row">
             <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
               <q-list dense>
-                <q-item
-                  dense
-                  tag="label"
-                  v-ripple
-                  :class="getBordered(alerts[2].value)"
-                >
+                <q-item dense tag="label" v-ripple :class="getBordered(alerts[2].value)">
                   <q-item-section>
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                      1.2. ความรู้ความสามารถ</q-item-label
-                    >
+                      1.2. ความรู้ความสามารถ</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="knowledge_level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="knowledge_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                      label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -601,27 +518,15 @@ const getBordered = (i: boolean) => {
 
             <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
               <q-list dense>
-                <q-item
-                  dense
-                  tag="label"
-                  v-ripple
-                  :class="getBordered(alerts[3].value)"
-                >
+                <q-item dense tag="label" v-ripple :class="getBordered(alerts[3].value)">
                   <q-item-section>
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                      1.3. ทักษะ</q-item-label
-                    >
+                      1.3. ทักษะ</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="skill_level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="skill_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                      label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -645,27 +550,15 @@ const getBordered = (i: boolean) => {
 
             <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
               <q-list dense>
-                <q-item
-                  dense
-                  tag="label"
-                  v-ripple
-                  :class="getBordered(alerts[4].value)"
-                >
+                <q-item dense tag="label" v-ripple :class="getBordered(alerts[4].value)">
                   <q-item-section>
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                      1.4. สมมรถนะ</q-item-label
-                    >
+                      1.4. สมมรถนะ</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="competency_level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="competency_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                      label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -689,27 +582,15 @@ const getBordered = (i: boolean) => {
 
             <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
               <q-list dense>
-                <q-item
-                  dense
-                  tag="label"
-                  v-ripple
-                  :class="getBordered(alerts[5].value)"
-                >
+                <q-item dense tag="label" v-ripple :class="getBordered(alerts[5].value)">
                   <q-item-section>
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                      1.5. ความสามารถในการเรียนรู้งาน</q-item-label
-                    >
+                      1.5. ความสามารถในการเรียนรู้งาน</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="learn_level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="learn_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                      label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -733,28 +614,16 @@ const getBordered = (i: boolean) => {
 
             <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
               <q-list dense>
-                <q-item
-                  dense
-                  tag="label"
-                  v-ripple
-                  :class="getBordered(alerts[6].value)"
-                >
+                <q-item dense tag="label" v-ripple :class="getBordered(alerts[6].value)">
                   <q-item-section>
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                       1.6.
-                      ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label
-                    >
+                      ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="apply_level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="apply_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                      label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -778,27 +647,15 @@ const getBordered = (i: boolean) => {
 
             <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
               <q-list dense>
-                <q-item
-                  dense
-                  tag="label"
-                  v-ripple
-                  :class="getBordered(alerts[7].value)"
-                >
+                <q-item dense tag="label" v-ripple :class="getBordered(alerts[7].value)">
                   <q-item-section>
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                      1.7. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label
-                    >
+                      1.7. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="success_level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="success_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                      label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -827,53 +684,30 @@ const getBordered = (i: boolean) => {
                     <q-item-label>
                       <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                       1.8 อื่นๆ
-                      <q-checkbox
-                        class="q-ml-sm"
-                        dense
-                        v-model="etc"
-                        @click="
-                          (achievement_other.text = ''),
-                            (achievement_other.level = 0)
-                        "
-                    /></q-item-label>
+                      <q-checkbox class="q-ml-sm" dense v-model="etc" @click="
+                        (achievement_other.text = ''),
+                        (achievement_other.level = 0)
+                        " /></q-item-label>
                   </q-item-section>
                 </q-item>
               </q-list>
             </q-card>
 
-            <q-card
-              v-if="etc"
-              class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-mt-sm q-pl-lg"
-            >
+            <q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-mt-sm q-pl-lg">
               <q-list dense>
                 <q-item dense tag="label" v-ripple>
                   <q-item-section class="q-ml-md">
                     <q-item-label>
-                      <q-input
-                        v-model="achievement_other.text"
-                        label="กรอกอื่นๆ"
-                        dense
-                        lazy-rules
-                        autogrow
-                        hide-bottom-space
-                        outlined
-                        class="bg-white"
-                        :rules="[
+                      <q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense lazy-rules autogrow
+                        hide-bottom-space outlined class="bg-white" :rules="[
                           (val) =>
                             (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                        ]"
-                      />
+                        ]" />
                     </q-item-label>
                   </q-item-section>
                   <q-item-section side>
-                    <q-rating
-                      v-model="achievement_other.level"
-                      max="5"
-                      size="sm"
-                      color="grey"
-                      :color-selected="ratingColors"
-                      label="ระดับการประเมินพฤติกรรม"
-                    >
+                    <q-rating v-model="achievement_other.level" max="5" size="sm" color="grey"
+                      :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                       <template v-slot:tip-1>
                         <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                       </template>
@@ -902,35 +736,17 @@ const getBordered = (i: boolean) => {
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                 จุดเด่น (ไม่เกิน 5 บรรทัด)
               </div>
-              <q-input
-                outlined
-                dense
-                v-model="achievement_strength_desc"
-                class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-                lazy-rules
-                type="textarea"
-                label="กรอกจุดเด่น"
-                hide-bottom-space
-                :row="5"
-                :rules="achievement_strengthRules"
-                ref="achievement_strengthRef"
-              />
+              <q-input outlined dense v-model="achievement_strength_desc"
+                class="col-xs-12 col-sm-11 col-md-10 offset-md-1" lazy-rules type="textarea" label="กรอกจุดเด่น"
+                hide-bottom-space :row="5" :rules="achievement_strengthRules" ref="achievement_strengthRef" />
             </div>
             <div class="col-12 row">
               <div class="col-12 text-top0 row items-center q-pl-lg">
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                 สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
               </div>
-              <q-input
-                outlined
-                dense
-                v-model="achievement_improve_desc"
-                class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-                type="textarea"
-                hide-bottom-space
-                label="กรอกสิ่งที่ควรปรับปรุง"
-                :row="5"
-              />
+              <q-input outlined dense v-model="achievement_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+                type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5" />
             </div>
           </div>
 
@@ -947,44 +763,29 @@ const getBordered = (i: boolean) => {
                 2.1 ความประพฤติ
               </div>
 
-              <q-card
-                flat
-                bordered
-                :class="[
-                  'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
-                  getBordered(alerts[8].value),
-                ]"
-              >
+              <q-card flat bordered :class="[
+                'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
+                getBordered(alerts[8].value),
+              ]">
                 <q-list dense v-for="(list, i) in list2_1" :key="i">
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>{{ list.label }}</q-item-label>
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating
-                        v-model="conduct_level[i]"
-                        :val="list.id"
-                        max="5"
-                        size="sm"
-                        color="grey"
-                        :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม"
-                      >
+                      <q-rating v-model="conduct_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                        :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip
-                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
-                          >
+                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip
-                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
-                          >
+                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -1001,44 +802,29 @@ const getBordered = (i: boolean) => {
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                 2.2 ความมีคุณธรรมจริยธรรม
               </div>
-              <q-card
-                flat
-                bordered
-                :class="[
-                  'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
-                  getBordered(alerts[9].value),
-                ]"
-              >
+              <q-card flat bordered :class="[
+                'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
+                getBordered(alerts[9].value),
+              ]">
                 <q-list dense v-for="(list, i) in list2_2" :key="i">
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>{{ list.label }}</q-item-label>
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating
-                        v-model="moral_level[i]"
-                        :val="list.id"
-                        max="5"
-                        size="sm"
-                        color="grey"
-                        :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม"
-                      >
+                      <q-rating v-model="moral_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                        :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip
-                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
-                          >
+                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip
-                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
-                          >
+                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -1055,44 +841,29 @@ const getBordered = (i: boolean) => {
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                 2.3 การรักษาวินัย
               </div>
-              <q-card
-                flat
-                bordered
-                :class="[
-                  'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
-                  getBordered(alerts[10].value),
-                ]"
-              >
+              <q-card flat bordered :class="[
+                'col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1',
+                getBordered(alerts[10].value),
+              ]">
                 <q-list dense v-for="(list, i) in list2_3" :key="i">
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>{{ list.label }}</q-item-label>
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating
-                        v-model="discipline_level[i]"
-                        :val="list.id"
-                        max="5"
-                        size="sm"
-                        color="grey"
-                        :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม"
-                      >
+                      <q-rating v-model="discipline_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                        :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip
-                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
-                          >
+                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip
-                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
-                          >
+                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -1108,65 +879,36 @@ const getBordered = (i: boolean) => {
               <div class="col-12 text-top0 row items-center q-pl-lg">
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                 2.4 อื่นๆ
-                <q-checkbox
-                  class="q-ml-sm"
-                  dense
-                  v-model="etc2"
-                  @click="
-                    (behavio_orther.text = ''), (behavio_orther.level = 0)
-                  "
-                />
+                <q-checkbox class="q-ml-sm" dense v-model="etc2" @click="
+                  (behavio_orther.text = ''), (behavio_orther.level = 0)
+                  " />
               </div>
-              <q-card
-                v-if="etc2"
-                flat
-                bordered
-                class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-              >
+              <q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
                 <q-list dense>
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>
-                        <q-input
-                          v-model="behavio_orther.text"
-                          label="กรอกอื่นๆ"
-                          dense
-                          lazy-rules
-                          autogrow
-                          hide-bottom-space
-                          outlined
-                          class="bg-white"
-                          :rules="[
+                        <q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense lazy-rules autogrow
+                          hide-bottom-space outlined class="bg-white" :rules="[
                             (val) =>
                               (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                          ]"
-                        />
+                          ]" />
                       </q-item-label>
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating
-                        v-model="behavio_orther.level"
-                        max="5"
-                        size="sm"
-                        color="grey"
-                        :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม"
-                      >
+                      <q-rating v-model="behavio_orther.level" max="5" size="sm" color="grey"
+                        :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip
-                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
-                          >
+                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip
-                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
-                          >
+                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -1184,35 +926,17 @@ const getBordered = (i: boolean) => {
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   จุดเด่น (ไม่เกิน 5 บรรทัด)
                 </div>
-                <q-input
-                  outlined
-                  dense
-                  v-model="behavior_strength_desc"
-                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-                  lazy-rules
-                  type="textarea"
-                  label="กรอกจุดเด่น"
-                  hide-bottom-space
-                  :row="5"
-                  :rules="behavio_strengthRules"
-                  ref="behavio_strengthRef"
-                />
+                <q-input outlined dense v-model="behavior_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+                  lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="behavio_strengthRules"
+                  ref="behavio_strengthRef" />
               </div>
               <div class="col-12 row">
                 <div class="col-12 text-top0 row items-center q-pl-lg">
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
                 </div>
-                <q-input
-                  outlined
-                  dense
-                  v-model="behavior_improve_desc"
-                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-                  type="textarea"
-                  hide-bottom-space
-                  label="กรอกสิ่งที่ควรปรับปรุง"
-                  :row="5"
-                />
+                <q-input outlined dense v-model="behavior_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+                  type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5" />
               </div>
             </div>
           </div>
@@ -1225,122 +949,61 @@ const getBordered = (i: boolean) => {
                 <q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
                 การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
               </div>
-              <q-card
-                flat
-                bordered
-                class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
-              >
+              <q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
                 <q-list dense>
-                  <q-item
-                    dense
-                    tag="label"
-                    v-ripple
-                    :class="getBordered(alerts[11].value)"
-                  >
+                  <q-item dense tag="label" v-ripple :class="getBordered(alerts[11].value)">
                     <q-item-section>
                       <q-item-label>1. การปฐมนิเทศ</q-item-label>
                     </q-item-section>
                     <q-item-section side>
                       <div class="row">
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="orientation"
-                          val="1"
-                          label="ดำเนินการเเล้ว"
-                        />
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="orientation"
-                          val="0"
-                          label=" ยังไม่ได้ดำเนินการ"
-                        />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="1"
+                          label="ดำเนินการเเล้ว" />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="0"
+                          label=" ยังไม่ได้ดำเนินการ" />
                       </div>
                     </q-item-section>
                   </q-item>
                   <q-separator class="q-my-xs" />
-                  <q-item
-                    dense
-                    tag="label"
-                    v-ripple
-                    :class="getBordered(alerts[12].value)"
-                  >
+                  <q-item dense tag="label" v-ripple :class="getBordered(alerts[12].value)">
                     <q-item-section>
                       <q-item-label>2. การเรียนรู้ด้วยตนเอง</q-item-label>
                     </q-item-section>
                     <q-item-section side>
                       <div class="row">
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="self_learning"
-                          val="1"
-                          label="ดำเนินการเเล้ว"
-                        />
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="self_learning"
-                          val="0"
-                          label=" ยังไม่ได้ดำเนินการ"
-                        />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning"
+                          val="1" label="ดำเนินการเเล้ว" />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning"
+                          val="0" label=" ยังไม่ได้ดำเนินการ" />
                       </div>
                     </q-item-section>
                   </q-item>
                   <q-separator class="q-my-xs" />
-                  <q-item
-                    dense
-                    tag="label"
-                    v-ripple
-                    :class="getBordered(alerts[13].value)"
-                  >
+                  <q-item dense tag="label" v-ripple :class="getBordered(alerts[13].value)">
                     <q-item-section>
                       <q-item-label>3. การอบรมสัมนาร่วมกัน</q-item-label>
                     </q-item-section>
                     <q-item-section side>
                       <div class="row">
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="training_seminar"
-                          val="1"
-                          label="ดำเนินการเเล้ว"
-                        />
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="training_seminar"
-                          val="0"
-                          label=" ยังไม่ได้ดำเนินการ"
-                        />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar"
+                          val="1" label="ดำเนินการเเล้ว" />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar"
+                          val="0" label=" ยังไม่ได้ดำเนินการ" />
                       </div>
                     </q-item-section>
                   </q-item>
                   <q-separator class="q-my-xs" />
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
-                      <q-item-label
-                        >4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด
-                        (ถ้ามี)</q-item-label
-                      >
+                      <q-item-label>4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด
+                        (ถ้ามี)</q-item-label>
                     </q-item-section>
                     <q-item-section side>
                       <div class="row">
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="other_training"
-                          val="1"
-                          label="ดำเนินการเเล้ว"
-                        />
-                        <q-radio
-                          checked-icon="task_alt"
-                          unchecked-icon="panorama_fish_eye"
-                          v-model="other_training"
-                          val="0"
-                          label=" ยังไม่ได้ดำเนินการ"
-                        />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training"
+                          val="1" label="ดำเนินการเเล้ว" />
+                        <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training"
+                          val="0" label=" ยังไม่ได้ดำเนินการ" />
                       </div>
                     </q-item-section>
                   </q-item>
@@ -1357,26 +1020,11 @@ const getBordered = (i: boolean) => {
                 ผู้บังคับบัญชา/ผู้มอบหมายงาน
               </div>
               <div class="col-12 row q-col-gutter-md">
-                <q-select
-                  class="col-xs-12 col-sm-8"
-                  dense
-                  v-model="Autherise"
-                  outlined
-                  :options="option"
-                  label="ผู้บังคับบัญชา"
-                  option-label="name"
-                  disable
-                />
+                <q-select class="col-xs-12 col-sm-8" dense v-model="Autherise" outlined :options="option"
+                  label="ผู้บังคับบัญชา" option-label="name" disable />
                 <div class="col-xs-12 col-sm-4">
-                  <datepicker
-                    menu-class-name="modalfix"
-                    v-model="dateAutherise"
-                    :locale="'th'"
-                    autoApply
-                    borderless
-                    :enableTimePicker="false"
-                    week-start="0"
-                  >
+                  <datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
+                    :enableTimePicker="false" week-start="0">
                     <template #year="{ year }">
                       {{ year + 543 }}
                     </template>
@@ -1384,24 +1032,12 @@ const getBordered = (i: boolean) => {
                       {{ parseInt(value + 543) }}
                     </template>
                     <template #trigger>
-                      <q-input
-                        outlined
-                        dense
-                        class="full-width datepicker col-3"
-                        :model-value="
-                          dateAutherise != null
-                            ? date2Thai(dateAutherise)
-                            : null
-                        "
-                        :label="`${'ลงวันที่'}`"
-                        :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                      >
+                      <q-input outlined dense class="full-width datepicker col-3" :model-value="dateAutherise != null
+                        ? date2Thai(dateAutherise)
+                        : null
+                        " :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
                         <template v-slot:prepend>
-                          <q-icon
-                            name="event"
-                            class="cursor-pointer"
-                            style="color: var(--q-primary)"
-                          >
+                          <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
                           </q-icon>
                         </template>
                       </q-input>
@@ -1445,9 +1081,9 @@ const getBordered = (i: boolean) => {
 .q-card {
   box-shadow: 0px 0px 0px 0px !important;
 }
+
 .border_custom {
   border: 2px solid #c10015;
   border-radius: 5px;
-  // color: #c10015;
 }
 </style>
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAddCommander.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAddCommander.vue
index d1ce720d0..22c780eee 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAddCommander.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAddCommander.vue
@@ -97,7 +97,7 @@ const fecthFormdata = async (id: string) => {
       person.value = res.data.data.person;
       assign.value = res.data.data.assign;
       option.value.push(res.data.data.director);
-      Autherise.value = res.data.data.director.name;
+      Autherise.value = res.data.data.director.name + ` (${res.data.data.director.PositionLineName}, ${res.data.data.director.PositionLevelName}, ${res.data.data.director.Oc})`;
 
       list1_1.value = res.data.data.assign_output;
       res.data.data.assign_output.forEach((e: any) => {
@@ -370,9 +370,23 @@ onMounted(async () => {
       <div class="row col-12 no-margin q-px-md q-pt-md">
         <div class="row col-12 q-gutter-lg">
           <div class="col-12 row">
+            <div class="col-12 row text-top0">
+              <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+              ผู้ทดลองปฏิบัติหน้าที่ราชการ {{person.name}}
+            </div>
+
+            <div class="col-12 q-pl-md q-pb-md">
+              <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+              <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span> {{ person.PositionLineName }}</div>
+              <div class="col-12"><span class="text-top0 q-pl-sm">ระดับ</span> {{ person.PositionLevelName }} </div>
+              <div class="col-12"><span class="text-top0 q-pl-sm">สังกัด</span> {{ person.Oc }}</div>
+            </div>
+
             <div class="col-12 text-top0 row items-center">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-              วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
+              การทดลองปฎิบัติหน้าที่ราชการ<span class="text-primary q-pr-sm">{{
+                "ครั้งที่ " + assign.round_no
+              }}</span> ตั้งแต่วันที่
               <span class="text-black q-px-sm">{{
                 date2Thai(assign.date_start)
               }}</span>
@@ -383,7 +397,7 @@ onMounted(async () => {
             </div>
             <div class="col-12 text-top0 row items-center">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-              <span class="text-primary q-pr-sm">{{
+              บันทึกผล<span class="text-primary q-pr-sm">{{
                 "ครั้งที่ " + round
               }}</span>
               ระหว่างวันที่
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultCommader.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultCommader.vue
index 64d4e5947..e5e88882c 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultCommader.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultCommader.vue
@@ -41,12 +41,12 @@ const evaluate_no = ref<number>(1);
 const dataArr = ref<any>();
 
 const checkArray = ref<number>(0);
-  const list1_1 = ref<any>([]);
+const list1_1 = ref<any>([]);
 const option = ref<any>([]);
 
 // part 1
-const evaluate_expenct_level = ref<any>([ { id: "1", label: "ผลผลิตของงานที่คาดหวัง 1", level: 0 } ]);
-const evaluate_ouptut = ref<any>([ { level: 0, text: "" } ]);
+const evaluate_expenct_level = ref<any>([{ id: "1", label: "ผลผลิตของงานที่คาดหวัง 1", level: 0 }]);
+const evaluate_ouptut = ref<any>([{ level: 0, text: "" }]);
 const knowledge_level = ref<number>(0);
 const skill_level = ref<number>(0);
 const competency_level = ref<number>(0);
@@ -102,7 +102,7 @@ const fecthFormdata = async () => {
       await fecthAssignoutput(res.data.data);
       await fectFormfull();
     })
-    .catch((e: any) => {})
+    .catch((e: any) => { })
     .finally(() => {
       if (props.action == "edit") {
         fecthFormRound();
@@ -110,7 +110,7 @@ const fecthFormdata = async () => {
     });
 };
 const fectFormfull = async () => {
-  Autherise.value = probationStore.director.name;
+  Autherise.value = probationStore.director.name + ` (${probationStore.director.PositionLineName}, ${probationStore.director.PositionLevelName}, ${probationStore.director.Oc})`;
   list1_1.value = probationStore.assignOutput;
   evaluate_expenct_level.value = await probationStore.assignOutput.map(
     (e: any) => ({
@@ -341,14 +341,7 @@ onMounted(async () => {
     <div class="toptitle text-dark col-12 row items-center q-gutter-md">
       <div>แบบบันทึกผล (ผู้บังคับบัญชา)</div>
       <div v-if="status == false">
-        <q-btn
-          dense
-          flat
-          round
-          color="primary"
-          @click="edit()"
-          icon="mdi-pencil-outline"
-        >
+        <q-btn dense flat round color="primary" @click="edit()" icon="mdi-pencil-outline">
           <q-tooltip>แก้ไขข้อมูล</q-tooltip>
         </q-btn>
       </div>
@@ -356,24 +349,33 @@ onMounted(async () => {
         <q-btn dense flat round color="red" @click="cancel()" icon="mdi-undo">
           <q-tooltip>ยกเลิก</q-tooltip>
         </q-btn>
-        <q-btn
-          dense
-          flat
-          round
-          class="q-ml-md"
-          color="public"
-          @click="savaForm()"
-          icon="mdi-content-save-outline"
-        >
+        <q-btn dense flat round class="q-ml-md" color="public" @click="savaForm()" icon="mdi-content-save-outline">
           <q-tooltip>บันทึกข้อมูล</q-tooltip>
         </q-btn>
       </div>
     </div>
     <div class="col-12 row q-gutter-lg">
       <div class="col-12 row">
+
+        <div class="col-12 row text-top0">
+          <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+          ผู้ทดลองปฏิบัติหน้าที่ราชการ {{ probationStore.person.name }}
+        </div>
+
+        <div class="col-12 q-pl-md q-pb-md">
+          <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+          <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span> {{
+            probationStore.person.PositionLineName }}</div>
+          <div class="col-12"><span class="text-top0 q-pl-sm">ระดับ</span> {{ probationStore.person.PositionLevelName }}
+          </div>
+          <div class="col-12"><span class="text-top0 q-pl-sm">สังกัด</span> {{ probationStore.person.Oc }}</div>
+        </div>
+
         <div class="col-12 text-top0 row items-center">
           <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          วันเริ่มทดลองปฏิบัติหน้าที่ราชการ ตั้งแต่วันที่
+          การทดลองปฎิบัติหน้าที่ราชการ<span class="text-primary q-pr-sm">{{
+            "ครั้งที่ " + assign.round_no
+          }}</span> ตั้งแต่วันที่
           <span class="text-black q-px-sm">{{
             date2Thai(assign.date_start)
           }}</span>
@@ -384,7 +386,7 @@ onMounted(async () => {
         </div>
         <div class="col-12 text-top0 row items-center">
           <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          <span class="text-primary q-pr-sm">{{
+          บันทึกผล<span class="text-primary q-pr-sm">{{
             "ครั้งที่ " + evaluate_no
           }}</span>
           ระหว่างวันที่
@@ -413,27 +415,15 @@ onMounted(async () => {
         <div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
           ผลผลิตของงานที่คาดหวัง
         </div>
-        <q-card
-          flat
-          bordered
-          class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-        >
+        <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
           <q-list dense v-for="(list, i) in list1_1" :key="i">
             <q-item dense tag="label" v-ripple>
               <q-item-section>
                 <q-item-label>{{ list.output_desc }}</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="evaluate_expenct_level[i].level"
-                  :val="list.id"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="evaluate_expenct_level[i].level" :val="list.id" max="5" size="sm" color="grey"
+                  :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -460,37 +450,16 @@ onMounted(async () => {
         <div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
           ผลผลิตของงานที่เกิดขึ้นจริง
         </div>
-        <q-card
-          flat
-          bordered
-          class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-        >
+        <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
           <q-list dense v-for="(list, i) in list1_2" :key="i">
             <q-item dense tag="label" v-ripple v-if="i < checkArray">
               <q-item-section>
-                <q-input
-                  outlined
-                  dense
-                  v-model="evaluate_ouptut[i].text"
-                  lazy-rules
-                  autogrow
-                  hide-bottom-space
-                  :row="1"
-                  :rules="evaluate_ouptutRules"
-                  :disable="!status"
-                />
+                <q-input outlined dense v-model="evaluate_ouptut[i].text" lazy-rules autogrow hide-bottom-space :row="1"
+                  :rules="evaluate_ouptutRules" :disable="!status" />
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="evaluate_ouptut[i].level"
-                  :val="list.id"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="evaluate_ouptut[i].level" :val="list.id" max="5" size="sm" color="grey"
+                  :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -520,19 +489,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.2. ความรู้ความสามารถ</q-item-label
-                >
+                  1.2. ความรู้ความสามารถ</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="knowledge_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="knowledge_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -560,19 +521,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.3. ทักษะ</q-item-label
-                >
+                  1.3. ทักษะ</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="skill_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="skill_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -600,19 +553,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.4. สมมรถนะ</q-item-label
-                >
+                  1.4. สมมรถนะ</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="competency_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="competency_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -640,19 +585,11 @@ onMounted(async () => {
               <q-item-section>
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                  1.5. ความสามารถในการเรียนรู้งาน</q-item-label
-                >
+                  1.5. ความสามารถในการเรียนรู้งาน</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="learn_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="learn_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -681,19 +618,11 @@ onMounted(async () => {
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   1.6.
-                  ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label
-                >
+                  ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="apply_level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="apply_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -721,55 +650,29 @@ onMounted(async () => {
                 <q-item-label>
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   1.7 อื่นๆ
-                  <q-checkbox
-                    class="q-ml-sm"
-                    dense
-                    v-model="etc"
-                    @click="
-                      (achievement_other.text = ''),
-                        (achievement_other.level = 0)
-                    "
-                    :disable="!status"
-                /></q-item-label>
+                  <q-checkbox class="q-ml-sm" dense v-model="etc" @click="
+                    (achievement_other.text = ''),
+                    (achievement_other.level = 0)
+                    " :disable="!status" /></q-item-label>
               </q-item-section>
             </q-item>
           </q-list>
         </q-card>
 
-        <q-card
-          v-if="etc"
-          class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg"
-        >
+        <q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
           <q-list dense>
             <q-item dense tag="label" v-ripple>
               <q-item-section class="q-ml-md">
                 <q-item-label>
-                  <q-input
-                    v-model="achievement_other.text"
-                    label="กรอกอื่นๆ"
-                    dense
-                    lazy-rules
-                    autogrow
-                    hide-bottom-space
-                    outlined
-                    class="bg-white"
-                    :rules="[
+                  <q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space
+                    outlined class="bg-white" :rules="[
                       (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                    ]"
-                    :disable="!status"
-                  />
+                    ]" :disable="!status" />
                 </q-item-label>
               </q-item-section>
               <q-item-section side>
-                <q-rating
-                  v-model="achievement_other.level"
-                  max="5"
-                  size="sm"
-                  color="grey"
-                  :color-selected="ratingColors"
-                  label="ระดับการประเมินพฤติกรรม"
-                  :disable="!status"
-                >
+                <q-rating v-model="achievement_other.level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                  label="ระดับการประเมินพฤติกรรม" :disable="!status">
                   <template v-slot:tip-1>
                     <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                   </template>
@@ -798,39 +701,18 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             จุดเด่น (ไม่เกิน 5 บรรทัด)
           </div>
-          <q-input
-            outlined
-            dense
-            v-model="achievement_strength_desc"
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-            lazy-rules
-            type="textarea"
-            label="กรอกจุดเด่น"
-            hide-bottom-space
-            :row="5"
-            :rules="achievement_strengthRules"
-            ref="achievement_strengthRef"
-            :disable="!status"
-          />
+          <q-input outlined dense v-model="achievement_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+            lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="achievement_strengthRules"
+            ref="achievement_strengthRef" :disable="!status" />
         </div>
         <div class="col-12 row">
           <div class="col-12 text-top0 row items-center q-pl-lg">
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
           </div>
-          <q-input
-            outlined
-            dense
-            v-model="achievement_improve_desc"
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-            lazy-rules
-            type="textarea"
-            hide-bottom-space
-            label="กรอกสิ่งที่ควรปรับปรุง"
-            :row="5"
-            ref="achievement_inproveRef"
-            :disable="!status"
-          />
+          <q-input outlined dense v-model="achievement_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+            lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5"
+            ref="achievement_inproveRef" :disable="!status" />
         </div>
       </div>
 
@@ -846,27 +728,15 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.1 ความประพฤติ
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense v-for="(list, i) in list2_1" :key="i">
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>{{ list.label }}</q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="conduct_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="conduct_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                    :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -894,27 +764,15 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.2 ความมีคุณธรรมจริยธรรม
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense v-for="(list, i) in list2_2" :key="i">
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>{{ list.label }}</q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="moral_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="moral_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                    :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -942,27 +800,15 @@ onMounted(async () => {
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.3 การรักษาวินัย
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense v-for="(list, i) in list2_3" :key="i">
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>{{ list.label }}</q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="discipline_level[i]"
-                    :val="list.id"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="discipline_level[i]" :val="list.id" max="5" size="sm" color="grey"
+                    :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -989,50 +835,23 @@ onMounted(async () => {
           <div class="col-12 text-top0 row items-center q-pl-lg">
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
             2.4 อื่นๆ
-            <q-checkbox
-              class="q-ml-sm"
-              dense
-              v-model="etc2"
-              @click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
-              :disable="!status"
-            />
+            <q-checkbox class="q-ml-sm" dense v-model="etc2"
+              @click="(behavio_orther.text = ''), (behavio_orther.level = 0)" :disable="!status" />
           </div>
-          <q-card
-            v-if="etc2"
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
-          >
+          <q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
             <q-list dense>
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
                   <q-item-label>
-                    <q-input
-                      v-model="behavio_orther.text"
-                      label="กรอกอื่นๆ"
-                      dense
-                      lazy-rules
-                      autogrow
-                      hide-bottom-space
-                      outlined
-                      class="bg-white"
-                      :rules="[
+                    <q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space
+                      outlined class="bg-white" :rules="[
                         (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                      ]"
-                      :disable="!status"
-                    />
+                      ]" :disable="!status" />
                   </q-item-label>
                 </q-item-section>
                 <q-item-section side>
-                  <q-rating
-                    v-model="behavio_orther.level"
-                    max="5"
-                    size="sm"
-                    color="grey"
-                    :color-selected="ratingColors"
-                    label="ระดับการประเมินพฤติกรรม"
-                    :disable="!status"
-                  >
+                  <q-rating v-model="behavio_orther.level" max="5" size="sm" color="grey" :color-selected="ratingColors"
+                    label="ระดับการประเมินพฤติกรรม" :disable="!status">
                     <template v-slot:tip-1>
                       <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                     </template>
@@ -1061,39 +880,18 @@ onMounted(async () => {
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
               จุดเด่น (ไม่เกิน 5 บรรทัด)
             </div>
-            <q-input
-              outlined
-              dense
-              v-model="behavior_strength_desc"
-              class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-              lazy-rules
-              type="textarea"
-              label="กรอกจุดเด่น"
-              hide-bottom-space
-              :row="5"
-              :rules="behavio_strengthRules"
-              ref="behavio_strengthRef"
-              :disable="!status"
-            />
+            <q-input outlined dense v-model="behavior_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+              lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="behavio_strengthRules"
+              ref="behavio_strengthRef" :disable="!status" />
           </div>
           <div class="col-12 row">
             <div class="col-12 text-top0 row items-center q-pl-lg">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
               สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
             </div>
-            <q-input
-              outlined
-              dense
-              v-model="behavior_improve_desc"
-              class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
-              lazy-rules
-              type="textarea"
-              hide-bottom-space
-              label="กรอกสิ่งที่ควรปรับปรุง"
-              :row="5"
-              ref="behavio_inproveRef"
-              :disable="!status"
-            />
+            <q-input outlined dense v-model="behavior_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
+              lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5"
+              ref="behavio_inproveRef" :disable="!status" />
           </div>
         </div>
       </div>
@@ -1106,11 +904,7 @@ onMounted(async () => {
             <q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
             การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
           </div>
-          <q-card
-            flat
-            bordered
-            class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
-          >
+          <q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
             <q-list dense>
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
@@ -1118,22 +912,10 @@ onMounted(async () => {
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="orientation"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="orientation"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
@@ -1144,22 +926,10 @@ onMounted(async () => {
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="self_learning"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="self_learning"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
@@ -1170,50 +940,24 @@ onMounted(async () => {
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="training_seminar"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="training_seminar"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
               <q-separator class="q-my-xs" />
               <q-item dense tag="label" v-ripple>
                 <q-item-section>
-                  <q-item-label
-                    >4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)</q-item-label
-                  >
+                  <q-item-label>4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)</q-item-label>
                 </q-item-section>
                 <q-item-section side>
                   <div class="row">
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="other_training"
-                      val="1"
-                      label="ดำเนินการเเล้ว"
-                      :disable="!status"
-                    />
-                    <q-radio
-                      checked-icon="task_alt"
-                      unchecked-icon="panorama_fish_eye"
-                      v-model="other_training"
-                      val="0"
-                      label=" ยังไม่ได้ดำเนินการ"
-                      :disable="!status"
-                    />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="1"
+                      label="ดำเนินการเเล้ว" :disable="!status" />
+                    <q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="0"
+                      label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
                   </div>
                 </q-item-section>
               </q-item>
@@ -1230,27 +974,11 @@ onMounted(async () => {
             ผู้บังคับบัญชา/ผู้มอบหมายงาน
           </div>
           <div class="col-12 row q-col-gutter-md">
-            <q-select
-              class="col-xs-12 col-sm-8"
-              dense
-              v-model="Autherise"
-              outlined
-              :options="option"
-              label="ผู้บังคับบัญชา"
-              option-label="name"
-              disable
-            />
+            <q-select class="col-xs-12 col-sm-8" dense v-model="Autherise" outlined :options="option"
+              label="ผู้บังคับบัญชา" option-label="name" disable />
             <div class="col-xs-12 col-sm-4">
-              <datepicker
-                menu-class-name="modalfix"
-                v-model="dateAutherise"
-                :locale="'th'"
-                autoApply
-                borderless
-                :enableTimePicker="false"
-                week-start="0"
-                :readonly="!status"
-              >
+              <datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
+                :enableTimePicker="false" week-start="0" :readonly="!status">
                 <template #year="{ year }">
                   {{ year + 543 }}
                 </template>
@@ -1258,23 +986,11 @@ onMounted(async () => {
                   {{ parseInt(value + 543) }}
                 </template>
                 <template #trigger>
-                  <q-input
-                    outlined
-                    dense
-                    class="full-width datepicker col-3"
-                    :model-value="
-                      dateAutherise != null ? date2Thai(dateAutherise) : null
-                    "
-                    :label="`${'ลงวันที่'}`"
-                    :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
-                    :disable="!status"
-                  >
+                  <q-input outlined dense class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
+                    " :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
+                    :disable="!status">
                     <template v-slot:prepend>
-                      <q-icon
-                        name="event"
-                        class="cursor-pointer"
-                        style="color: var(--q-primary)"
-                      >
+                      <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
                       </q-icon>
                     </template>
                   </q-input>
@@ -1284,10 +1000,7 @@ onMounted(async () => {
           </div>
         </div>
       </div>
-      <q-toolbar
-        class="text-primary"
-        v-if="routeName == 'probationFormAddresult'"
-      >
+      <q-toolbar class="text-primary" v-if="routeName == 'probationFormAddresult'">
         <q-space />
         <q-btn label="บันทึก" color="secondary" @click="savaForm" />
       </q-toolbar>
diff --git a/src/modules/05_placement/storeProbation.ts b/src/modules/05_placement/storeProbation.ts
index 5d303ecb5..a81946ac3 100644
--- a/src/modules/05_placement/storeProbation.ts
+++ b/src/modules/05_placement/storeProbation.ts
@@ -1,5 +1,5 @@
 import { defineStore } from "pinia";
-import { ref } from "vue";
+import { reactive, ref } from "vue";
 
 export const useProbationDataStore = defineStore("probationStore", () => {
   const assign = ref<any>([])
@@ -9,6 +9,7 @@ export const useProbationDataStore = defineStore("probationStore", () => {
 
   const assignOutput = ref<any>([])
   const director = ref<any>([])
+  const person = ref<any>([])
 
   const fecthdataAssign = async (data: any) => {
     assign.value = await data.assign
@@ -18,6 +19,7 @@ export const useProbationDataStore = defineStore("probationStore", () => {
   const fecthAssignoutput = (data: any) => {
     assignOutput.value = data.assign_output
     director.value = data.director
+    person.value = data.person
   }
 
   const ratingColors = ref<string[]>([
@@ -88,6 +90,7 @@ export const useProbationDataStore = defineStore("probationStore", () => {
     tabs,
     assignOutput,
     director,
+    person,
     mainTab,
     ratingColors,
     orderId,

From 4a5ffab8f1beaa24266d557774a9fdc3f3a596e6 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Tue, 26 Sep 2023 16:02:06 +0700
Subject: [PATCH 2/3] =?UTF-8?q?=E0=B9=81=E0=B8=9A=E0=B8=9A=E0=B8=97?=
 =?UTF-8?q?=E0=B8=94=E0=B8=A5=E0=B8=AD=E0=B8=87=E0=B8=87=E0=B8=B2=E0=B8=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../04_registry/components/Profile.vue        |   2 -
 .../probation/FormEvaluation/FormEvaluate.vue |  34 +-
 .../FormEvaluation/FormEvaluateAdd.vue        |  25 +-
 .../FormEvaluation/FormEvaluateScore.vue      |  28 +-
 .../FormEvaluation/FormEvaluateScoreAdd.vue   | 632 ++++++++++++++----
 5 files changed, 573 insertions(+), 148 deletions(-)

diff --git a/src/modules/04_registry/components/Profile.vue b/src/modules/04_registry/components/Profile.vue
index e745a6b8e..034d853d8 100644
--- a/src/modules/04_registry/components/Profile.vue
+++ b/src/modules/04_registry/components/Profile.vue
@@ -833,8 +833,6 @@ const fetchData = async () => {
       const reason = reasonOptions.value.filter(
         (r: DataOption) => r.id == data.leaveReason
       );
-      console.log(reason);
-
       if (reason.length > 0) {
         leaveReason.value = ` (พ้นจากราชการด้วยสาเหตุ: ${reason[0].name})`;
       } else if (data.leaveReason !== null && data.leaveReason !== "") {
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluate.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluate.vue
index 3234ca4e0..471b59e0a 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluate.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluate.vue
@@ -76,7 +76,7 @@ const edit = () => {
 
 const cancel = () => {
   status.value = false;
-  fecthAssign()
+  fecthAssign();
 };
 
 const props = defineProps({
@@ -89,8 +89,6 @@ const list2_1 = probationStore.behavior_no1;
 const list2_2 = probationStore.behavior_no2;
 const list2_3 = probationStore.behavior_no3;
 
-
-
 const fecthAssign = async () => {
   showLoader();
   await http
@@ -105,7 +103,9 @@ const fecthAssign = async () => {
         start_date.value = res.data.data.start_date;
         date_finish.value = res.data.data.end_date;
       }
-      Autherise.value = res.data.data.commander.name;
+      Autherise.value =
+        probationStore.director.name +
+        ` (${probationStore.director.PositionLineName}, ${probationStore.director.PositionLevelName}, ${probationStore.director.Oc})`;
     })
     .catch((e) => {
       messageError($q, e);
@@ -269,8 +269,6 @@ onMounted(async () => {
     fetchEvaluate();
   }
 });
-
-
 </script>
 
 <template>
@@ -309,8 +307,28 @@ onMounted(async () => {
     <div class="row col-12 q-gutter-lg">
       <div class="col-12 row">
         <div class="col-12 text-top0 row items-center">
+          <div class="col-12 row text-top0">
+            <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+            ผู้ทดลองปฏิบัติหน้าที่ราชการ {{ probationStore.person.name }}
+          </div>
+          <div class="col-12 q-pl-md q-pb-md">
+            <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+            <div class="col-12">
+              <span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span>
+              {{ probationStore.person.PositionLineName }}
+            </div>
+            <div class="col-12">
+              <span class="text-top0 q-pl-sm">ระดับ</span>
+              {{ probationStore.person.PositionLevelName }}
+            </div>
+            <div class="col-12">
+              <span class="text-top0 q-pl-sm">สังกัด</span>
+              {{ probationStore.person.Oc }}
+            </div>
+          </div>
+
           <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-          วันเริ่มทดลองปฏิบัติหน้าที่ราชการ ตั้งแต่วันที่
+          การทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
           <span class="text-black q-px-sm">{{
             date2Thai(assign.date_start)
           }}</span>
@@ -321,6 +339,7 @@ onMounted(async () => {
         </div>
         <div class="col-12 text-top0 row items-center">
           <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+          แบบประเมินผล
           <span class="text-primary q-pr-sm">{{
             "ครั้งที่ " + evaluate_no
           }}</span>
@@ -1109,6 +1128,7 @@ onMounted(async () => {
           </div>
         </div>
       </div>
+
       <!-- <Footer /> -->
       <q-toolbar class="text-primary" v-if="routeName == 'FormEvaluateAdd'">
         <q-space />
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateAdd.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateAdd.vue
index 83e72a855..1df082674 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateAdd.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateAdd.vue
@@ -79,7 +79,9 @@ const fecthAssign = async (id: string) => {
       assign.value = res.data.data.assign;
       commander.value = res.data.data.commander;
       option.value.push(commander.value);
-      Autherise.value = commander.value.name;
+      Autherise.value =
+        res.data.data.commander.name +
+        ` (${res.data.data.commander.PositionLineName}, ${res.data.data.commander.PositionLevelName}, ${res.data.data.commander.Oc})`;
       evaluate_no.value = res.data.data.evaluate_no;
       start_date.value = res.data.data.start_date;
       date_finish.value = res.data.data.end_date;
@@ -303,8 +305,26 @@ onMounted(async () => {
         <div class="row col-12 q-gutter-lg">
           <div class="col-12 row">
             <div class="col-12 text-top0 row items-center">
+              <div class="col-12 row text-top0">
+                <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                ผู้ทดลองปฏิบัติหน้าที่ราชการ {{ person.name }}
+              </div>
+              <div class="col-12 q-pl-md q-pb-md">
+                <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+                <div class="col-12">
+                  <span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span>
+                  {{ person.PositionLineName }}
+                </div>
+                <div class="col-12">
+                  <span class="text-top0 q-pl-sm">ระดับ</span>
+                  {{ person.PositionLevelName }}
+                </div>
+                <div class="col-12">
+                  <span class="text-top0 q-pl-sm">สังกัด</span> {{ person.Oc }}
+                </div>
+              </div>
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-              วันเริ่มทดลองปฏิบัติหน้าที่ราชการ ตั้งแต่วันที่
+              การทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
               <span class="text-black q-px-sm">{{
                 date2Thai(assign.date_start)
               }}</span>
@@ -315,6 +335,7 @@ onMounted(async () => {
             </div>
             <div class="col-12 text-top0 row items-center">
               <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+              แบบประเมินผล
               <span class="text-primary q-pr-sm">{{
                 "ครั้งที่ " + round
               }}</span>
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore.vue
index 38fcb3f63..c7114e3a3 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScore.vue
@@ -36,7 +36,7 @@ const edit = () => {
 };
 const cancel = () => {
   status.value = false;
-  fecthAssign()
+  fecthAssign();
 };
 const evaluate_no = ref<number>();
 const evaluate_id = ref<string>("");
@@ -442,8 +442,27 @@ onMounted(async () => {
       <div class="row col-12 q-gutter-lg">
         <div class="col-12 row">
           <div class="col-12 text-top0 row items-center">
+            <div class="col-12 row text-top0">
+              <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+              ผู้ทดลองปฏิบัติหน้าที่ราชการ {{ probationStore.person.name }}
+            </div>
+            <div class="col-12 q-pl-md q-pb-md">
+              <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+              <div class="col-12">
+                <span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span>
+                {{ probationStore.person.PositionLineName }}
+              </div>
+              <div class="col-12">
+                <span class="text-top0 q-pl-sm">ระดับ</span>
+                {{ probationStore.person.PositionLevelName }}
+              </div>
+              <div class="col-12">
+                <span class="text-top0 q-pl-sm">สังกัด</span>
+                {{ probationStore.person.Oc }}
+              </div>
+            </div>
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-            วันเริ่มทดลองปฏิบัติหน้าที่ราชการ ตั้งแต่วันที่
+            การทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
             <span class="text-black q-px-sm">{{
               date2Thai(assign.date_start)
             }}</span>
@@ -454,6 +473,7 @@ onMounted(async () => {
           </div>
           <div class="col-12 text-top0 row items-center">
             <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+            แบบประเมินผล
             <span class="text-primary q-pr-sm">{{
               "ครั้งที่ " + evaluate_no
             }}</span>
@@ -1147,9 +1167,7 @@ onMounted(async () => {
 
         <div class="row col-12 q-gutter-lg no-margin justify-center">
           <div class="col-xs-12 col-sm-11 row justify-center">
-            <div class="col-12 text-top0 items-center">
-              สรุปผลการพัฒนา
-            </div>
+            <div class="col-12 text-top0 items-center">สรุปผลการพัฒนา</div>
             <div class="col-12">
               <q-select
                 :disable="!status"
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScoreAdd.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScoreAdd.vue
index 8ff5366bd..4df2413f2 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScoreAdd.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScoreAdd.vue
@@ -6,7 +6,7 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useRoute, useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import criterion from "@/modules/05_placement/components/Other/Criterion.vue"
+import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
 
 const $q = useQuasar();
 const probationStore = useProbationDataStore();
@@ -113,8 +113,6 @@ const list2_1 = probationStore.behavior_no1;
 const list2_2 = probationStore.behavior_no2;
 const list2_3 = probationStore.behavior_no3;
 
-
-
 // score
 const score1 = computed(() => {
   if (
@@ -202,8 +200,8 @@ const percent_score2: any = computed(() => {
   return percent2.toFixed(2);
 });
 const percent_sum: any = computed(() => {
-  let sum = ((Number(percent_score1.value) + Number(percent_score2.value)) / 2);
-  evaluate_result.value = (sum > 60 ? 1 : 0);
+  let sum = (Number(percent_score1.value) + Number(percent_score2.value)) / 2;
+  evaluate_result.value = sum > 60 ? 1 : 0;
   return sum.toFixed(2);
 });
 const score4 = computed(() => {
@@ -215,12 +213,11 @@ const score4 = computed(() => {
   );
 });
 const score5 = computed(() => {
-  const total = (
+  const total =
     Number(orientation_percent.value) +
     Number(self_learning_percent.value) +
     Number(training_seminar_percent.value) +
-    Number(other_training_percent.value)
-  );
+    Number(other_training_percent.value);
   develop_result.value = total > 60 ? 1 : 0;
 
   return total;
@@ -236,7 +233,6 @@ const lengthdiscipline_level = computed(() => {
 });
 const variablesToWatch = [learn_level, apply_level, success_level];
 const savaForm = async () => {
-
   let hasError = false;
   if (
     learn_level.value === 0 ||
@@ -276,7 +272,6 @@ const savaForm = async () => {
         dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
       }
     });
-
   }
 
   if (hasError === true) {
@@ -297,7 +292,6 @@ const savaForm = async () => {
 
     dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
   }
-
 };
 const putformData = () => {
   const data = {
@@ -394,9 +388,19 @@ watch(lengthdiscipline_level, (newLength) => {
   <q-form ref="myForm">
     <q-card class="my-card" flat bordered>
       <q-toolbar>
-        <div class="text-h6 text-weight-medium text-dark col-12 row items-center q-py-md">
-          <q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm"
-            @click="router.go(-1)" />
+        <div
+          class="text-h6 text-weight-medium text-dark col-12 row items-center q-py-md"
+        >
+          <q-btn
+            icon="mdi-arrow-left"
+            unelevated
+            round
+            dense
+            flat
+            color="primary"
+            class="q-mr-sm"
+            @click="router.go(-1)"
+          />
           การทดลองปฏิบัติหน้าที่ราชการของ {{ person.name }}
         </div>
       </q-toolbar>
@@ -410,8 +414,27 @@ watch(lengthdiscipline_level, (newLength) => {
           <div class="row col-12 q-gutter-lg">
             <div class="col-12 row">
               <div class="col-12 text-top0 row items-center">
+                <div class="col-12 row text-top0">
+                  <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                  ผู้ทดลองปฏิบัติหน้าที่ราชการ {{ person.name }}
+                </div>
+                <div class="col-12 q-pl-md q-pb-md">
+                  <!-- <div class="col-12"><span class="text-top0 q-pl-sm">ตำแหน่ง</span> {{ person.Position }}</div> -->
+                  <div class="col-12">
+                    <span class="text-top0 q-pl-sm">ตำแหน่งในสายงาน</span>
+                    {{ person.PositionLineName }}
+                  </div>
+                  <div class="col-12">
+                    <span class="text-top0 q-pl-sm">ระดับ</span>
+                    {{ person.PositionLevelName }}
+                  </div>
+                  <div class="col-12">
+                    <span class="text-top0 q-pl-sm">สังกัด</span>
+                    {{ person.Oc }}
+                  </div>
+                </div>
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
+                การทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
                 <span class="text-black q-px-sm">{{
                   date2Thai(assign.date_start)
                 }}</span>
@@ -422,6 +445,7 @@ watch(lengthdiscipline_level, (newLength) => {
               </div>
               <div class="col-12 text-top0 row items-center">
                 <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                แบบประเมินผล
                 <span class="text-primary q-pr-sm">{{
                   `ครั้งที่ ${evaluate_no}`
                 }}</span>
@@ -452,26 +476,46 @@ watch(lengthdiscipline_level, (newLength) => {
             <div class="col-12 row no-margin">
               <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
                 <q-list dense>
-                  <q-item dense tag="label" v-ripple :class="getBordered(alerts[0].value)">
+                  <q-item
+                    dense
+                    tag="label"
+                    v-ripple
+                    :class="getBordered(alerts[0].value)"
+                  >
                     <q-item-section>
                       <q-item-label>
-                        <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                        1.1. ความสามารถในการเรียนรู้งาน</q-item-label>
+                        <q-icon
+                          name="mdi-label"
+                          color="grey-4"
+                          class="q-pr-sm"
+                        />
+                        1.1. ความสามารถในการเรียนรู้งาน</q-item-label
+                      >
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating v-model="learn_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม">
+                      <q-rating
+                        v-model="learn_level"
+                        max="5"
+                        size="sm"
+                        color="grey"
+                        :color-selected="ratingColors"
+                        label="ระดับการประเมินพฤติกรรม"
+                      >
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                          <q-tooltip
+                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                          <q-tooltip
+                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -484,27 +528,47 @@ watch(lengthdiscipline_level, (newLength) => {
 
               <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
                 <q-list dense>
-                  <q-item dense tag="label" v-ripple :class="getBordered(alerts[1].value)">
+                  <q-item
+                    dense
+                    tag="label"
+                    v-ripple
+                    :class="getBordered(alerts[1].value)"
+                  >
                     <q-item-section>
                       <q-item-label>
-                        <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                        <q-icon
+                          name="mdi-label"
+                          color="grey-4"
+                          class="q-pr-sm"
+                        />
                         1.2.
-                        ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
+                        ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label
+                      >
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating v-model="apply_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม">
+                      <q-rating
+                        v-model="apply_level"
+                        max="5"
+                        size="sm"
+                        color="grey"
+                        :color-selected="ratingColors"
+                        label="ระดับการประเมินพฤติกรรม"
+                      >
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                          <q-tooltip
+                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                          <q-tooltip
+                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -517,26 +581,46 @@ watch(lengthdiscipline_level, (newLength) => {
 
               <q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
                 <q-list dense>
-                  <q-item dense tag="label" v-ripple :class="getBordered(alerts[2].value)">
+                  <q-item
+                    dense
+                    tag="label"
+                    v-ripple
+                    :class="getBordered(alerts[2].value)"
+                  >
                     <q-item-section>
                       <q-item-label>
-                        <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
-                        1.3. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
+                        <q-icon
+                          name="mdi-label"
+                          color="grey-4"
+                          class="q-pr-sm"
+                        />
+                        1.3. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label
+                      >
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating v-model="success_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
-                        label="ระดับการประเมินพฤติกรรม">
+                      <q-rating
+                        v-model="success_level"
+                        max="5"
+                        size="sm"
+                        color="grey"
+                        :color-selected="ratingColors"
+                        label="ระดับการประเมินพฤติกรรม"
+                      >
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                          <q-tooltip
+                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                          <q-tooltip
+                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -552,43 +636,73 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>
-                        <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                        <q-icon
+                          name="mdi-label"
+                          color="grey-4"
+                          class="q-pr-sm" />
                         1.4 อื่นๆ
-                        <q-checkbox class="q-ml-sm" dense v-model="etc" @click="
-                          (achievement_other.text = ''),
-                          (achievement_other.level = 0)
-                          " /></q-item-label>
+                        <q-checkbox
+                          class="q-ml-sm"
+                          dense
+                          v-model="etc"
+                          @click="
+                            (achievement_other.text = ''),
+                              (achievement_other.level = 0)
+                          "
+                      /></q-item-label>
                     </q-item-section>
                   </q-item>
                 </q-list>
               </q-card>
 
-              <q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
+              <q-card
+                v-if="etc"
+                class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg"
+              >
                 <q-list dense>
                   <q-item dense tag="label" v-ripple>
                     <q-item-section class="q-ml-md">
                       <q-item-label>
-                        <q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense lazy-rules autogrow
-                          hide-bottom-space outlined class="bg-white" :rules="[
+                        <q-input
+                          v-model="achievement_other.text"
+                          label="กรอกอื่นๆ"
+                          dense
+                          lazy-rules
+                          autogrow
+                          hide-bottom-space
+                          outlined
+                          class="bg-white"
+                          :rules="[
                             (val) =>
                               (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                          ]" />
+                          ]"
+                        />
                       </q-item-label>
                     </q-item-section>
                     <q-item-section side>
-                      <q-rating v-model="achievement_other.level" max="5" size="sm" color="grey"
-                        :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
+                      <q-rating
+                        v-model="achievement_other.level"
+                        max="5"
+                        size="sm"
+                        color="grey"
+                        :color-selected="ratingColors"
+                        label="ระดับการประเมินพฤติกรรม"
+                      >
                         <template v-slot:tip-1>
                           <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                         </template>
                         <template v-slot:tip-2>
-                          <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                          <q-tooltip
+                            >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-3>
                           <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                         </template>
                         <template v-slot:tip-4>
-                          <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                          <q-tooltip
+                            >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                          >
                         </template>
                         <template v-slot:tip-5>
                           <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -619,27 +733,42 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   2.1 ความประพฤติ
                 </div>
-                <q-card :class="getBordered(alerts[3].value)" flat bordered
-                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
+                <q-card
+                  :class="getBordered(alerts[3].value)"
+                  flat
+                  bordered
+                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
+                >
                   <q-list dense v-for="(list, i) in list2_1" :key="i">
                     <q-item dense tag="label" v-ripple>
                       <q-item-section>
                         <q-item-label>{{ list.label }}</q-item-label>
                       </q-item-section>
                       <q-item-section side>
-                        <q-rating v-model="conduct_level[i]" :val="list.id" max="5" size="sm" color="grey"
-                          :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
+                        <q-rating
+                          v-model="conduct_level[i]"
+                          :val="list.id"
+                          max="5"
+                          size="sm"
+                          color="grey"
+                          :color-selected="ratingColors"
+                          label="ระดับการประเมินพฤติกรรม"
+                        >
                           <template v-slot:tip-1>
                             <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                           </template>
                           <template v-slot:tip-2>
-                            <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                            <q-tooltip
+                              >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-3>
                             <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                           </template>
                           <template v-slot:tip-4>
-                            <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                            <q-tooltip
+                              >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-5>
                             <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -647,7 +776,10 @@ watch(lengthdiscipline_level, (newLength) => {
                         </q-rating>
                       </q-item-section>
                     </q-item>
-                    <q-separator class="q-my-xs" v-if="i + 1 < list2_1.length" />
+                    <q-separator
+                      class="q-my-xs"
+                      v-if="i + 1 < list2_1.length"
+                    />
                   </q-list>
                 </q-card>
               </div>
@@ -656,27 +788,42 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   2.2 ความมีคุณธรรมจริยธรรม
                 </div>
-                <q-card :class="getBordered(alerts[4].value)" flat bordered
-                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
+                <q-card
+                  :class="getBordered(alerts[4].value)"
+                  flat
+                  bordered
+                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
+                >
                   <q-list dense v-for="(list, i) in list2_2" :key="i">
                     <q-item dense tag="label" v-ripple>
                       <q-item-section>
                         <q-item-label>{{ list.label }}</q-item-label>
                       </q-item-section>
                       <q-item-section side>
-                        <q-rating v-model="moral_level[i]" :val="list.id" max="5" size="sm" color="grey"
-                          :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
+                        <q-rating
+                          v-model="moral_level[i]"
+                          :val="list.id"
+                          max="5"
+                          size="sm"
+                          color="grey"
+                          :color-selected="ratingColors"
+                          label="ระดับการประเมินพฤติกรรม"
+                        >
                           <template v-slot:tip-1>
                             <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                           </template>
                           <template v-slot:tip-2>
-                            <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                            <q-tooltip
+                              >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-3>
                             <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                           </template>
                           <template v-slot:tip-4>
-                            <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                            <q-tooltip
+                              >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-5>
                             <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -684,7 +831,10 @@ watch(lengthdiscipline_level, (newLength) => {
                         </q-rating>
                       </q-item-section>
                     </q-item>
-                    <q-separator class="q-my-xs" v-if="i + 1 < list2_2.length" />
+                    <q-separator
+                      class="q-my-xs"
+                      v-if="i + 1 < list2_2.length"
+                    />
                   </q-list>
                 </q-card>
               </div>
@@ -693,27 +843,42 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   2.3 การรักษาวินัย
                 </div>
-                <q-card flat :class="getBordered(alerts[5].value)" bordered
-                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
+                <q-card
+                  flat
+                  :class="getBordered(alerts[5].value)"
+                  bordered
+                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
+                >
                   <q-list dense v-for="(list, i) in list2_3" :key="i">
                     <q-item dense tag="label" v-ripple>
                       <q-item-section>
                         <q-item-label>{{ list.label }}</q-item-label>
                       </q-item-section>
                       <q-item-section side>
-                        <q-rating v-model="discipline_level[i]" :val="list.id" max="5" size="sm" color="grey"
-                          :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
+                        <q-rating
+                          v-model="discipline_level[i]"
+                          :val="list.id"
+                          max="5"
+                          size="sm"
+                          color="grey"
+                          :color-selected="ratingColors"
+                          label="ระดับการประเมินพฤติกรรม"
+                        >
                           <template v-slot:tip-1>
                             <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                           </template>
                           <template v-slot:tip-2>
-                            <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                            <q-tooltip
+                              >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-3>
                             <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                           </template>
                           <template v-slot:tip-4>
-                            <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                            <q-tooltip
+                              >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-5>
                             <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -721,7 +886,10 @@ watch(lengthdiscipline_level, (newLength) => {
                         </q-rating>
                       </q-item-section>
                     </q-item>
-                    <q-separator class="q-my-xs" v-if="i + 1 < list2_3.length" />
+                    <q-separator
+                      class="q-my-xs"
+                      v-if="i + 1 < list2_3.length"
+                    />
                   </q-list>
                 </q-card>
               </div>
@@ -729,36 +897,65 @@ watch(lengthdiscipline_level, (newLength) => {
                 <div class="col-12 text-top0 row items-center q-pl-lg">
                   <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
                   2.4 อื่นๆ
-                  <q-checkbox class="q-ml-sm" dense v-model="etc2" @click="
-                    (behavio_orther.text = ''), (behavio_orther.level = 0)
-                    " />
+                  <q-checkbox
+                    class="q-ml-sm"
+                    dense
+                    v-model="etc2"
+                    @click="
+                      (behavio_orther.text = ''), (behavio_orther.level = 0)
+                    "
+                  />
                 </div>
-                <q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
+                <q-card
+                  v-if="etc2"
+                  flat
+                  bordered
+                  class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
+                >
                   <q-list dense>
                     <q-item dense tag="label" v-ripple>
                       <q-item-section>
                         <q-item-label>
-                          <q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense lazy-rules autogrow
-                            hide-bottom-space outlined class="bg-white" :rules="[
+                          <q-input
+                            v-model="behavio_orther.text"
+                            label="กรอกอื่นๆ"
+                            dense
+                            lazy-rules
+                            autogrow
+                            hide-bottom-space
+                            outlined
+                            class="bg-white"
+                            :rules="[
                               (val) =>
                                 (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                            ]" />
+                            ]"
+                          />
                         </q-item-label>
                       </q-item-section>
                       <q-item-section side>
-                        <q-rating v-model="behavio_orther.level" max="5" size="sm" color="grey"
-                          :color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
+                        <q-rating
+                          v-model="behavio_orther.level"
+                          max="5"
+                          size="sm"
+                          color="grey"
+                          :color-selected="ratingColors"
+                          label="ระดับการประเมินพฤติกรรม"
+                        >
                           <template v-slot:tip-1>
                             <q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
                           </template>
                           <template v-slot:tip-2>
-                            <q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
+                            <q-tooltip
+                              >ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-3>
                             <q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
                           </template>
                           <template v-slot:tip-4>
-                            <q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
+                            <q-tooltip
+                              >สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip
+                            >
                           </template>
                           <template v-slot:tip-5>
                             <q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
@@ -769,7 +966,9 @@ watch(lengthdiscipline_level, (newLength) => {
                   </q-list>
                 </q-card>
               </div>
-              <div class="text-top0 col-xs-12 col-sm-11 q-pt-sm q-px-md q-my-none">
+              <div
+                class="text-top0 col-xs-12 col-sm-11 q-pt-sm q-px-md q-my-none"
+              >
                 <div class="row col-12 justify-between q-py-sm">
                   <div class="text-black">คะแนนรวมพฤติกรรมการปฎิบัติราชการ</div>
                   <div class="text-weight-bold text-black">{{ score2 }}</div>
@@ -790,9 +989,14 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>
-                        <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                        <q-icon
+                          name="mdi-label"
+                          color="grey-4"
+                          class="q-pr-sm"
+                        />
                         3.1.
-                        ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ</q-item-label>
+                        ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ</q-item-label
+                      >
                     </q-item-section>
                     <q-item-section>
                       <q-item-label style="color: gray">
@@ -823,9 +1027,14 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
                       <q-item-label>
-                        <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
+                        <q-icon
+                          name="mdi-label"
+                          color="grey-4"
+                          class="q-pr-sm"
+                        />
                         3.2.
-                        พฤติกรรมของผู้ทดลองปฏิบัติบัติหน้าที่ราชการ</q-item-label>
+                        พฤติกรรมของผู้ทดลองปฏิบัติบัติหน้าที่ราชการ</q-item-label
+                      >
                     </q-item-section>
                     <q-item-section>
                       <q-item-label style="color: gray">
@@ -855,7 +1064,9 @@ watch(lengthdiscipline_level, (newLength) => {
                 <q-list dense>
                   <q-item dense tag="label" v-ripple>
                     <q-item-section>
-                      <q-item-label class="text-black"> ผลคะแนนรวม</q-item-label>
+                      <q-item-label class="text-black">
+                        ผลคะแนนรวม</q-item-label
+                      >
                     </q-item-section>
                     <q-item-section>
                       <q-item-label style="color: gray">
@@ -890,7 +1101,11 @@ watch(lengthdiscipline_level, (newLength) => {
                   <q-avatar class="bg-grey-2 q-mr-sm" size="28px">4</q-avatar>
                   การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
                 </div>
-                <q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
+                <q-card
+                  flat
+                  bordered
+                  class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
+                >
                   <div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
                     <div class="row q-gutter-md q-pl-md">
                       <div class="col-8 text-weight-medium">หัวข้อ</div>
@@ -902,30 +1117,60 @@ watch(lengthdiscipline_level, (newLength) => {
                   <div class="row q-gutter-md align-center q-pl-md">
                     <div class="col-8">1. การปฐมนิเทศ</div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="orientation" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="orientation"
+                      />
                     </div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="orientation_percent" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="orientation_percent"
+                      />
                     </div>
                   </div>
                   <q-separator class="q-my-xs" />
                   <div class="row q-gutter-md align-center q-pl-md">
                     <div class="col-8">2. การเรียนรู้ด้วยตนเอง</div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="self_learning" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="self_learning"
+                      />
                     </div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="self_learning_percent" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="self_learning_percent"
+                      />
                     </div>
                   </div>
                   <q-separator class="q-my-xs" />
                   <div class="row q-gutter-md align-center q-pl-md">
                     <div class="col-8">3. การอบรมสัมนาร่วมกัน</div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="training_seminar" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="training_seminar"
+                      />
                     </div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="training_seminar_percent" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="training_seminar_percent"
+                      />
                     </div>
                   </div>
                   <q-separator class="q-my-xs" />
@@ -934,10 +1179,20 @@ watch(lengthdiscipline_level, (newLength) => {
                       4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)
                     </div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="other_training" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="other_training"
+                      />
                     </div>
                     <div class="col">
-                      <q-input outlined dense type="number" v-model="other_training_percent" />
+                      <q-input
+                        outlined
+                        dense
+                        type="number"
+                        v-model="other_training_percent"
+                      />
                     </div>
                   </div>
                   <q-separator class="q-my-xs" />
@@ -961,13 +1216,25 @@ watch(lengthdiscipline_level, (newLength) => {
                   สรุปผลการพัฒนา
                 </div>
                 <div class="col-12">
-                  <q-select class="col-xs-12" dense v-model="develop_result" outlined :options="develop_result_option"
-                    option-label="name" option-value="value" label="เลือกสรุปผลการพัฒนา" map-options emit-value
-                    hide-bottom-space :rules="[
+                  <q-select
+                    class="col-xs-12"
+                    dense
+                    v-model="develop_result"
+                    outlined
+                    :options="develop_result_option"
+                    option-label="name"
+                    option-value="value"
+                    label="เลือกสรุปผลการพัฒนา"
+                    map-options
+                    emit-value
+                    hide-bottom-space
+                    :rules="[
                       (val) =>
                         (val !== null && val !== undefined) ||
                         'กรุณาเลือกสรุปผลการพัฒนา',
-                    ]" ref="selectResult1" />
+                    ]"
+                    ref="selectResult1"
+                  />
                 </div>
               </div>
             </div>
@@ -978,13 +1245,25 @@ watch(lengthdiscipline_level, (newLength) => {
                   สรุปผล การประเมินผลทดลองปฎิบัติหน้าที่ราชการ
                 </div>
                 <div class="col-12">
-                  <q-select class="col-xs-12" dense v-model="evaluate_result" outlined :options="evaluate_result_option"
-                    option-label="name" option-value="value" label="เลือกสรุปผล การประเมินผลทดลองปฎิบัติหน้าที่ราชการ"
-                    map-options emit-value hide-bottom-space :rules="[
+                  <q-select
+                    class="col-xs-12"
+                    dense
+                    v-model="evaluate_result"
+                    outlined
+                    :options="evaluate_result_option"
+                    option-label="name"
+                    option-value="value"
+                    label="เลือกสรุปผล การประเมินผลทดลองปฎิบัติหน้าที่ราชการ"
+                    map-options
+                    emit-value
+                    hide-bottom-space
+                    :rules="[
                       (val) =>
                         (val !== null && val !== undefined) ||
                         'กรุณาเลือกสรุปผลการประเมินผลทดลองปฎิบัติหน้าที่ราชการ',
-                    ]" ref="selectResult2" />
+                    ]"
+                    ref="selectResult2"
+                  />
                 </div>
               </div>
             </div>
@@ -1001,11 +1280,26 @@ watch(lengthdiscipline_level, (newLength) => {
                   ประธานคณะกรรมการประเมินผลการปฏิบัติหน้าที่ราชการ
                 </div>
                 <div class="col-12 row q-col-gutter-md">
-                  <q-select class="col-xs-12 col-sm-8" dense v-model="director_id" outlined label="ชื่อ-นามสกุล"
-                    option-label="name" disable />
+                  <q-select
+                    class="col-xs-12 col-sm-8"
+                    dense
+                    v-model="director_id"
+                    outlined
+                    label="ชื่อ-นามสกุล"
+                    option-label="name"
+                    disable
+                  />
                   <div class="col-xs-12 col-sm-4">
-                    <datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" :readonly="!status"
-                      autoApply borderless :enableTimePicker="false" week-start="0">
+                    <datepicker
+                      menu-class-name="modalfix"
+                      v-model="dateAutherise"
+                      :locale="'th'"
+                      :readonly="!status"
+                      autoApply
+                      borderless
+                      :enableTimePicker="false"
+                      week-start="0"
+                    >
                       <template #year="{ year }">
                         {{ year + 543 }}
                       </template>
@@ -1013,10 +1307,25 @@ watch(lengthdiscipline_level, (newLength) => {
                         {{ parseInt(value + 543) }}
                       </template>
                       <template #trigger>
-                        <q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
-                          " :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
+                        <q-input
+                          outlined
+                          dense
+                          :disable="!status"
+                          class="full-width datepicker col-3"
+                          :model-value="
+                            dateAutherise != null
+                              ? date2Thai(dateAutherise)
+                              : null
+                          "
+                          :label="`${'ลงวันที่'}`"
+                          :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
+                        >
                           <template v-slot:prepend>
-                            <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                            <q-icon
+                              name="event"
+                              class="cursor-pointer"
+                              style="color: var(--q-primary)"
+                            >
                             </q-icon>
                           </template>
                         </q-input>
@@ -1032,11 +1341,26 @@ watch(lengthdiscipline_level, (newLength) => {
                   <!-- ความเห็นของผู้มีอำนาจสั่งบรรจุตามมาตรา 52 -->
                 </div>
                 <div class="col-12 row q-col-gutter-md">
-                  <q-select class="col-xs-12 col-sm-8" dense v-model="director_id2" outlined label="ชื่อ-นามสกุล" disable
-                    option-label="name" />
+                  <q-select
+                    class="col-xs-12 col-sm-8"
+                    dense
+                    v-model="director_id2"
+                    outlined
+                    label="ชื่อ-นามสกุล"
+                    disable
+                    option-label="name"
+                  />
                   <div class="col-xs-12 col-sm-4">
-                    <datepicker menu-class-name="modalfix" v-model="director1_dated" :locale="'th'" autoApply borderless
-                      :readonly="!status" :enableTimePicker="false" week-start="0">
+                    <datepicker
+                      menu-class-name="modalfix"
+                      v-model="director1_dated"
+                      :locale="'th'"
+                      autoApply
+                      borderless
+                      :readonly="!status"
+                      :enableTimePicker="false"
+                      week-start="0"
+                    >
                       <template #year="{ year }">
                         {{ year + 543 }}
                       </template>
@@ -1044,12 +1368,25 @@ watch(lengthdiscipline_level, (newLength) => {
                         {{ parseInt(value + 543) }}
                       </template>
                       <template #trigger>
-                        <q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="director1_dated != null
-                          ? date2Thai(director1_dated)
-                          : null
-                          " :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
+                        <q-input
+                          outlined
+                          dense
+                          :disable="!status"
+                          class="full-width datepicker col-3"
+                          :model-value="
+                            director1_dated != null
+                              ? date2Thai(director1_dated)
+                              : null
+                          "
+                          :label="`${'ลงวันที่'}`"
+                          :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
+                        >
                           <template v-slot:prepend>
-                            <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                            <q-icon
+                              name="event"
+                              class="cursor-pointer"
+                              style="color: var(--q-primary)"
+                            >
                             </q-icon>
                           </template>
                         </q-input>
@@ -1065,11 +1402,26 @@ watch(lengthdiscipline_level, (newLength) => {
                   <!-- ผู้มีอำนาจสั่งบรรจุตามมาตรา 52 -->
                 </div>
                 <div class="col-12 row q-col-gutter-md">
-                  <q-select class="col-xs-12 col-sm-8" dense v-model="director_id3" outlined label="ชื่อ-นามสกุล" disable
-                    option-label="name" />
+                  <q-select
+                    class="col-xs-12 col-sm-8"
+                    dense
+                    v-model="director_id3"
+                    outlined
+                    label="ชื่อ-นามสกุล"
+                    disable
+                    option-label="name"
+                  />
                   <div class="col-xs-12 col-sm-4">
-                    <datepicker menu-class-name="modalfix" v-model="director2_dated" :locale="'th'" autoApply
-                      :readonly="!status" borderless :enableTimePicker="false" week-start="0">
+                    <datepicker
+                      menu-class-name="modalfix"
+                      v-model="director2_dated"
+                      :locale="'th'"
+                      autoApply
+                      :readonly="!status"
+                      borderless
+                      :enableTimePicker="false"
+                      week-start="0"
+                    >
                       <template #year="{ year }">
                         {{ year + 543 }}
                       </template>
@@ -1077,12 +1429,25 @@ watch(lengthdiscipline_level, (newLength) => {
                         {{ parseInt(value + 543) }}
                       </template>
                       <template #trigger>
-                        <q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="director2_dated != null
-                          ? date2Thai(director2_dated)
-                          : null
-                          " :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
+                        <q-input
+                          outlined
+                          dense
+                          :disable="!status"
+                          class="full-width datepicker col-3"
+                          :model-value="
+                            director2_dated != null
+                              ? date2Thai(director2_dated)
+                              : null
+                          "
+                          :label="`${'ลงวันที่'}`"
+                          :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
+                        >
                           <template v-slot:prepend>
-                            <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                            <q-icon
+                              name="event"
+                              class="cursor-pointer"
+                              style="color: var(--q-primary)"
+                            >
                             </q-icon>
                           </template>
                         </q-input>
@@ -1091,16 +1456,19 @@ watch(lengthdiscipline_level, (newLength) => {
                   </div>
                 </div>
               </div>
-
             </div>
 
-
             <div class="col-12">
               <q-separator size="3px" color="grey-2" />
             </div>
             <div class="row col-12">
               <q-space />
-              <q-btn label="บันทึก" color="secondary" @click="savaForm" v-if="status" />
+              <q-btn
+                label="บันทึก"
+                color="secondary"
+                @click="savaForm"
+                v-if="status"
+              />
             </div>
           </div>
         </div>

From b0bf47994a406b18bbe74146a02d8a59af363d08 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Tue, 26 Sep 2023 16:02:15 +0700
Subject: [PATCH 3/3] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84?=
 =?UTF-8?q?=E0=B8=82=20tree?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

-ดึง selected จาก api
---
 src/modules/02_organizational/views/MainTreeEmployee.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/modules/02_organizational/views/MainTreeEmployee.vue b/src/modules/02_organizational/views/MainTreeEmployee.vue
index ec671f3bf..988a34527 100644
--- a/src/modules/02_organizational/views/MainTreeEmployee.vue
+++ b/src/modules/02_organizational/views/MainTreeEmployee.vue
@@ -1077,6 +1077,7 @@ const fetchData = async () => {
           positionEmployeeStatus: r.positionEmployeeStatus,
           positionMasterUserNote: r.positionMasterUserNote,
           qualification: r.qualification,
+          organizationId: r.organizationId,
         });
       });
     })
@@ -1602,6 +1603,7 @@ const selectData = async (props: any) => {
   isCondition.value = props.isCondition;
   conditionNote.value = props.conditionNote;
   id.value = props.id;
+  selected.value = props.organizationId;
 };
 
 /**