com : app.vue - breadcrumb 주석

com : navbar.vue - 테마기능 삭제
func : VFlexTable 커스텀추가
fix : 계약관리, 결재함 스타일수정
This commit is contained in:
Kasi
2025-05-28 18:11:05 +09:00
parent 7340dc6299
commit d0c91e6a44
6 changed files with 694 additions and 142 deletions

View File

@@ -7,24 +7,24 @@ definePage({
requiresAuth: true,
},
})
const breadcrumb = [
{
label: '가격조사',
hideLabel: true,
// use external links
link: 'https://vuero.cssninja.io/',
},
{
label: '가격조사',
// or generate a router link with 'to' props
to: '/components/',
}
]
// const breadcrumb = [
// {
// label: '가격조사',
// hideLabel: true,
// // use external links
// link: 'https://vuero.cssninja.io/',
// },
// {
// label: '가격조사',
// // or generate a router link with 'to' props
// to: '/components/',
// }
// ]
</script>
<template>
<Navbar>
<VBreadcrumb :items="breadcrumb" separator="succeeds" />
<!-- <VBreadcrumb :items="breadcrumb" separator="succeeds" />-->
<RouterView />
</Navbar>
</template>

View File

@@ -4,6 +4,9 @@ import type { VFlexTableWrapperSortFunction, VFlexTableWrapperFilterFunction } f
import { users } from '/src/data/layouts/card-grid-v1'
import PriceDetail from "/@src/pages/app/priceDetail.vue";
import {conveterNo, updateApprovalStatus} from "/@src/service/approvalApi.ts";
import {formatDatefromString} from "/@src/utils/common/comfunc.ts";
import {getPriceList} from "/@src/service/priceApi.ts";
import {getContractList} from "/@src/service/contractApi.ts";
onBeforeMount(async () => {
@@ -13,6 +16,45 @@ const isModalOpen = ref(false)
const selectedRow = ref<any>(null)
const prcsNo = ref<string>('')
const router = useRouter()
const totalItems = ref(0) // 전체 아이템 수
const currentPage = ref<number>(1) // 현재 페이지
const itemsPerPage = 8
const totalPages = ref(1)
async function getApprovalListData(){
const today = new Date()
searchParamsList.regSdt = new Date().setDate(today.getDate() - 30)
searchParamsList.regEdt = new Date().setDate(today.getDate())
const priceBase = {
params:{
regSdt: formatDatefromString(searchParamsList.regSdt),
regEdt: formatDatefromString(searchParamsList.regEdt),
page: 1,
row: itemsPerPage
}
}
const result = await getPriceList(priceBase)
params.priceData = result.content
//페이지 관련 값 설정
totalItems.value = result.totalElements
totalPages.value = result.totalPages
}
const searchApprovalDoc = async (item) => {
const searchParams = {
params: {
title : searchParamsList.title, //제목
regSdt: formatDatefromString(searchParamsList.regSdt),//등록시작일
regEdt: formatDatefromString(searchParamsList.regEdt),//등록종료일
page: item,//페이지
row: itemsPerPage //아이템갯수
}
}
const result = await getContractList(searchParams)
params.priceData = result.content
totalItems.value = result.totalElements
}
const masks = ref({
modelValue: 'YYYY-MM-DD',
@@ -34,14 +76,7 @@ const params = reactive({
},
{ key: 'process', label: '구분', cellClass: 'paymentColumn5' },
],
flexWrapperColumn: {
apprNo: { label: '결재번호', cellClass: 'paymentColumn1', searchable: true, sortable: true },
title: { label: '제목', cellClass: 'paymentColumn2', searchable: true, sortable: true },
name: { label: '작성자', cellClass: 'paymentColumn3', searchable: true, sortable: true },
regDt: { label: '등록일', cellClass: 'paymentColumn4', searchable: true, sortable: true },
process: { label: '구분', cellClass: 'paymentColumn5', searchable: true, sortable: true },
},
paymentParams: [],
approvalParams: [],
rowData: [],
})
@@ -57,10 +92,13 @@ async function getIntegratedPaymentList() {
sabun: '17131303', // 김진형 17131303, 손원창 17131304
}
const result = await getIntegratedApproval(paymentParams)
params.paymentParams = result.content.map(item => ({
params.approvalParams = result.content.map(item => ({
...item,
process: gubunMap[item.gubun] || '',
}))
//페이지 관련 값 설정
totalItems.value = result.totalElements
totalPages.value = result.totalPages
}
async function updateIntegratedPaymentApprovalFunc() {
@@ -95,16 +133,16 @@ const gubunMap = {
}
const searchApproval = async () => {
const paymentParams = {
const searchParams = {
params: {
title: params.title,
page: '1',
row: '10',
},
}
const result = await getIntegratedApproval(paymentParams)
params.paymentParams = result.content
console.log(params.paymentParams)
const result = await getIntegratedApproval(searchParams)
params.approvalParams = result.content
console.log(params.approvalParams)
}
type User = (typeof users)[0]
@@ -271,7 +309,7 @@ const onRowClick2 = (row: any) => {
</div>
<div class="datatable-wrapper">
<ComVFlexTable
:data="params.paymentParams"
:data="params.approvalParams"
:columns="params.flexColumn"
:separators="true"
:clickable="true"
@@ -308,119 +346,32 @@ const onRowClick2 = (row: any) => {
<VButton type="submit" color="primary" raised @click="updateIntegratedPaymentApprovalFunc">승인</VButton>
</template>
</VModal>
<!-- <VFlexTableWrapper :columns="params.flexWrapperColumn" :data="params.paymentParams">-->
<!--&lt;!&ndash;-->
<!-- Here we retrieve the internal wrapperState.-->
<!-- Note that we can not destructure it-->
<!-- &ndash;&gt;-->
<!-- <template #default="wrapperState">-->
<!-- <pre>data: {{ data }}</pre>-->
<!-- &lt;!&ndash; We can place any content inside the default slot&ndash;&gt;-->
<!-- <VFlexTableToolbar>-->
<!-- <template #left>-->
<!-- &lt;!&ndash; We can bind wrapperState.searchInput to any input &ndash;&gt;-->
<!-- <VField>-->
<!-- <VControl icon="lucide:search">-->
<!-- <input-->
<!-- v-model="wrapperState.searchInput"-->
<!-- type="text"-->
<!-- class="input is-rounded"-->
<!-- placeholder="Filter..."-->
<!-- >-->
<!-- </VControl>-->
<!-- </VField>-->
<!-- </template>-->
<!-- <template #right>-->
<!-- &lt;!&ndash; We can also bind wrapperState.limit &ndash;&gt;-->
<!-- <VField>-->
<!-- <VControl>-->
<!-- <div class="select is-rounded">-->
<!-- <select v-model="wrapperState.limit">-->
<!-- <option :value="1">-->
<!-- 1 results per page-->
<!-- </option>-->
<!-- <option :value="10">-->
<!-- 10 results per page-->
<!-- </option>-->
<!-- <option :value="15">-->
<!-- 15 results per page-->
<!-- </option>-->
<!-- <option :value="25">-->
<!-- 25 results per page-->
<!-- </option>-->
<!-- <option :value="50">-->
<!-- 50 results per page-->
<!-- </option>-->
<!-- </select>-->
<!-- </div>-->
<!-- </VControl>-->
<!-- </VField>-->
<!-- </template>-->
<!-- </VFlexTableToolbar>-->
<!-- &lt;!&ndash;-->
<!-- The VFlexTable "data" and "columns" props-->
<!-- will be inherited from parent VFlexTableWrapper-->
<!-- &ndash;&gt;-->
<!-- <VFlexTable rounded>-->
<!-- &lt;!&ndash; Custom "name" cell content &ndash;&gt;-->
<!-- <template #body-cell="{ row, column }">-->
<!-- <template v-if="column.key === 'name'">-->
<!-- <VAvatar-->
<!-- size="medium"-->
<!-- :picture="row.medias.avatar"-->
<!-- :badge="row.medias.badge"-->
<!-- :initials="row.initials"-->
<!-- />-->
<!-- <div>-->
<!-- <span class="dark-text" :title="row.name">-->
<!-- {{ row?.shortname }}-->
<!-- </span>-->
<!-- <VTextEllipsis-->
<!-- width="280px"-->
<!-- class="light-text"-->
<!-- :title="row.bio"-->
<!-- >-->
<!-- <small>{{ row?.bio }}</small>-->
<!-- </VTextEllipsis>-->
<!-- </div>-->
<!-- </template>-->
<!-- </template>-->
<!-- </VFlexTable>-->
<!-- &lt;!&ndash; Table Pagination with wrapperState.page binded&ndash;&gt;-->
<!-- <VFlexPagination-->
<!-- v-model:current-page="wrapperState.page"-->
<!-- class="mt-6"-->
<!-- :item-per-page="wrapperState.limit"-->
<!-- :total-items="wrapperState.total"-->
<!-- :max-links-displayed="5"-->
<!-- no-router-->
<!-- />-->
<!-- </template>-->
<!-- </VFlexTableWrapper>-->
<VFlexPagination
:item-per-page="itemsPerPage"
:total-items="totalItems"
v-model:current-page="currentPage"
/>
</div>
</div>
<!-- <VButtons class="v-buttons-right-align">-->
<!-- <VButton-->
<!-- color="primary"-->
<!-- icon="fas fa-plus"-->
<!-- elevated-->
<!-- to="/app/PriceInsert"-->
<!-- >-->
<!-- 등록-->
<!-- </VButton>-->
<!-- </VButtons>-->
</div>
</template>
<style scoped lang="scss">
.datatable-toolbar {
padding: 1rem 1.5rem;
margin: 0 0 2rem 0;
}
.flex-table .flex-table-item {
min-height: 3rem;
}
input[readonly] {
background-color: #f5f5f5; /* 살짝 회색 배경 */
color: #888; /* 글자색 연하게 */
cursor: not-allowed; /* 마우스 커서 변경 */
border-color: #e0e0e0; /* 테두리 연하게 */
background-color: #f5f5f5;
color: #888;
cursor: not-allowed;
border-color: #e0e0e0;
}
.v-buttons-right-align {

View File

@@ -207,3 +207,15 @@ function getContractDetail(){
</VButtons>
</div>
</template>
<style scoped lang="scss">
.datatable-toolbar {
padding: 1rem 1.5rem;
margin: 0 0 2rem 0;
}
.flex-table .flex-table-item {
min-height: 3rem;
}
</style>

View File

@@ -326,7 +326,7 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
<td>견적서확인</td>
<td colspan="9">
<slot name="status"
v-if="!params.svyYn"
v-if="params.stCd == '0100'"
>
<div style="display: flex; justify-content: flex-end; gap: 8px;">
<VButton
@@ -340,7 +340,7 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
</div>
</slot>
<div class="mt-2">
<ComVFlexTable
<VFlexTableCustomize
:key="params.prcsBizs.length"
:data="params.prcsBizs"
:columns="params.prcsBizsColumn"
@@ -373,13 +373,12 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
</template>
<!-- 나머지 컬럼만 슬롯 사용 -->
<template #body-cell="{ column, index, value, row }">
<pre>{{ row.sendYn }}</pre>
<div>
<span v-if="column.key=='num'">{{index + 1}}</span>
<span v-else>{{ value }}</span>
</div>
</template>
</ComVFlexTable>
</VFlexTableCustomize>
</div>
</td>
</tr>