style : 가격조사 목록 스타일 맞추기

src/components/app-vuero/ComVFlexTable.vue

@@ -129,8 +129,10 @@ const columns = computed(() => {
                 column.grow === true && 'is-grow',
                 column.grow === 'lg' && 'is-grow-lg',
                 column.grow === 'xl' && 'is-grow-xl',
+                column.align === 'start' && 'cell-start',
                 column.align === 'end' && 'cell-end',
                 column.align === 'center' && 'cell-center',
+                column.cellClass,
               ]"
             />
             <span
@@ -139,8 +141,10 @@ const columns = computed(() => {
                 column.grow === true && 'is-grow',
                 column.grow === 'lg' && 'is-grow-lg',
                 column.grow === 'xl' && 'is-grow-xl',
+                column.align === 'start' && 'cell-start',
                 column.align === 'end' && 'cell-end',
                 column.align === 'center' && 'cell-center',
+                column.cellClass,
               ]"
             >{{ column.label }}</span>
           </slot>
@@ -167,8 +171,10 @@ const columns = computed(() => {
                 column.grow === true && 'is-grow',
                 column.grow === 'lg' && 'is-grow-lg',
                 column.grow === 'xl' && 'is-grow-xl',
+                column.align === 'start' && 'cell-start',
                 column.align === 'end' && 'cell-end',
                 column.align === 'center' && 'cell-center',
+                column.cellClass,
               ]"
             />
             <span
@@ -177,8 +183,10 @@ const columns = computed(() => {
                 column.grow === true && 'is-grow',
                 column.grow === 'lg' && 'is-grow-lg',
                 column.grow === 'xl' && 'is-grow-xl',
+                column.align === 'start' && 'cell-start',
                 column.align === 'end' && 'cell-end',
                 column.align === 'center' && 'cell-center',
+                column.cellClass,
               ]"
             >{{ column.label }}</span>
           </slot>

src/pages/app/priceManagement.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { getPriceList } from '/@src/service/priceApi'
-import { formatDatefromObject , formatDatefromString } from '/@src/utils/common/comfunc'
+import { formatDatefromString } from '/@src/utils/common/comfunc'
 const router = useRouter()
 
 onBeforeMount(async () => {
@@ -29,11 +29,11 @@ const params = reactive({
   sessionUser:'',
   priceData: [],
   felxColumn: [
-    { key: 'cateNm', label: '분야' },
+    { key: 'cateNm', label: '분야', align: 'center', cellClass: 'approvalColumn5'},
-    { key: 'title', label: '제목' },
+    { key: 'title', label: '제목',align: 'start'},
-    { key: 'regNm', label: '담당자' },
+    { key: 'regNm', label: '담당자', align: 'center', cellClass: 'approvalColumn5'},
-    { key: 'regDt', label: '등록일' },
+    { key: 'regDt', label: '등록일' ,align: 'start', cellClass: 'approvalColumn5'},
-    { key: 'stNm', label: '등록 상태' },
+    { key: 'stNm', label: '등록 상태', cellClass: 'approvalColumn5' },
   ]
 })
 
@@ -219,6 +219,7 @@ watch(currentPage, (newParams) => {
             :separators="true"
             :clickable="true"
             :compact="true"
+            :useApprovalHeader="true"
             @rowClick="getPriceDetail"
         />
         <VPlaceholderPage
@@ -258,7 +259,7 @@ watch(currentPage, (newParams) => {
           :total-items="totalItems"
           v-model:current-page="currentPage"
       />
-  </div>
+</div>
 
 </template>