ปรับ ui form

src/views/HistoryView.vue

@@ -27,6 +27,7 @@ function fetchlist() {
       status: "",
       Morningstatus: "1",
       AfternoonStatus: "1",
+      statusEdit: "wait",
     },
     {
       no: "2",
@@ -38,6 +39,7 @@ function fetchlist() {
       status: "ลงเวลาเรียบร้อย",
       Morningstatus: "2",
       AfternoonStatus: "2",
+      statusEdit: "edit",
     },
     {
       no: "3",
@@ -49,6 +51,7 @@ function fetchlist() {
       status: "สาย ทำงานครบ",
       Morningstatus: "3",
       AfternoonStatus: "2",
+      statusEdit: "edit",
     },
     {
       no: "4",
@@ -60,6 +63,7 @@ function fetchlist() {
       status: "สาย ทำงานไม่ครบ",
       Morningstatus: "3",
       AfternoonStatus: "3",
+      statusEdit: "approve",
     },
   ];
   stores.fetchHistoryList(listData);
@@ -92,84 +96,6 @@ function fetchlist() {
         <div class="col-12 q-pa-md text-grey-9">
           <ToolBar />
           <Table />
-          <!-- <Table
-            :style="$q.screen.gt.xs ? 'max-height: 64vh' : ''"
-            :rows="rows"
-            :columns="columns"
-            :filter="filter"
-            :visible-columns="visibleColumns"
-            v-model:inputfilter="filter"
-            v-model:inputvisible="visibleColumns"
-            :pagination="initialPagination"
-            :inputShow="false"
-            :grid="$q.screen.gt.xs ? false : true"
-          >
-            <template #columns="props">
-              <q-tr :props="props">
-                <q-td key="no" :props="props">
-                  {{ props.rowIndex + 1 }}
-                </q-td>
-                <q-td key="date" :props="props">
-                  {{ props.row.date }}
-                </q-td>
-                <q-td key="in" :props="props">
-                  {{ props.row.in }}
-                </q-td>
-                <q-td key="loIn" :props="props">
-                  {{ props.row.loIn }}
-                </q-td>
-                <q-td key="out" :props="props">
-                  {{ props.row.out }}
-                </q-td>
-                <q-td key="loOut" :props="props">
-                  {{ props.row.loOut }}
-                </q-td>
-                <q-td key="status" :props="props">
-                  <span
-                    :class="
-                      props.row.status == 'ลงเวลาเรียบร้อย'
-                        ? 'text-blue'
-                        : 'text-orange'
-                    "
-                    >{{ props.row.status }}</span
-                  >
-                </q-td>
-              </q-tr>
-            </template>
-            <template #item="props">
-              <div
-                class="q-pa-xs col-xs-12 col-sm-6 col-md-4 col-lg-3 grid-style-transition"
-              >
-                <q-card bordered flat class="q-py-sm shadow-0">
-                  <q-list dense>
-                    <q-item
-                      v-for="col in props.cols"
-                      :key="col.name"
-                      :props="props"
-                    >
-                      <q-item-section>
-                        <q-item-label caption>{{ col.label }}</q-item-label>
-                      </q-item-section>
-                      <q-item-section side>
-                        <q-item-label>
-                          <span
-                            v-if="col.name == 'status'"
-                            :class="
-                              props.row.status == 'ลงเวลาเรียบร้อย'
-                                ? 'text-blue'
-                                : 'text-orange'
-                            "
-                            >{{ col.value }}</span
-                          >
-                          <span v-else class="text-black">{{ col.value }}</span>
-                        </q-item-label>
-                      </q-item-section>
-                    </q-item>
-                  </q-list>
-                </q-card>
-              </div>
-            </template>
-          </Table> -->
         </div>
       </q-card>
     </div>