func : 계약관리 등록폼

- 가격조사 가져오기 활성화

src/pages/app/ContractInsert.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 
 import axios from 'axios'
+import notyf from "/@src/plugins/notyf.ts";
 
 const registerFormOpen = ref(false)
 const params = reactive({
@@ -22,6 +23,29 @@ const params = reactive({
   modalColumn: [],
 })
 
+const completedPriceDataParams = reactive({
+  prcsNo:'',
+  cateCd:'',
+  cateNm:'',
+  bizNo:'',
+  compNm:'',
+  title:'',
+  content:'',
+  regSdat:'',
+  regEdat:'',
+  regSabun:'',
+  regNm:'',
+  regDt:'',
+  amt:'',
+  stCd:'',
+  stNm:'',
+  svyDt:'',
+  reason:'',
+  estimates: [],
+  page: 1,
+  row: 5,
+})
+
 params.modalColumn = [
   { key: 'cateNm', label: '분야' },
   { key: 'title', label: '제목' },
@@ -30,11 +54,13 @@ params.modalColumn = [
   { key: 'title', label: '비고' },
   { key: 'regNm', label: '선택' },
 ]
+
 const selectedCode = ref()
+const priceSearchCheckBoxStatus = ref(false)
 
 const data = reactive({
   contractData: [],
-  priceSearchData: [],
+  completedPriceSearchData: [],
 })
 
 const isLoading = ref(false)
@@ -44,8 +70,7 @@ watch(registerFormOpen, async (isOpen) => {
     // error.value = null
     try {
       const priceSearchDataRespone = await axios.get('/api/cont/prcs')
-      console.log(priceSearchDataRespone.data)
-      data.priceSearchData = Array.isArray(priceSearchDataRespone.data) ? priceSearchDataRespone.data : []
+      data.completedPriceSearchData = Array.isArray(priceSearchDataRespone.data) ? priceSearchDataRespone.data : []
     }
     catch (error) {
       console.log(error)
@@ -73,8 +98,8 @@ function getDateDiff(start, end) {
 }
 
 const contractPeriod = computed(() => {
-  const start = params.regSdt
-  const end = params.regEdt
+  const start = completedPriceDataParams.regSdat
+  const end = completedPriceDataParams.regEdat
   const startStr = formatDate(start)
   const endStr = formatDate(end)
   const diff = getDateDiff(start, end)
@@ -95,6 +120,67 @@ const contractPeriod = computed(() => {
   }
 })
 
+
+function handlePriceRowClick(row) {
+  completedPriceDataParams.prcsNo = row.prcsNo || ''
+  completedPriceDataParams.cateCd = row.cateCd || ''
+  completedPriceDataParams.cateNm = row.cateNm || ''
+  completedPriceDataParams.title = row.title || ''
+  completedPriceDataParams.content = row.content || ''
+  completedPriceDataParams.regSdat = row.regSdat || ''
+  completedPriceDataParams.regEdat = row.regEdat || ''
+  completedPriceDataParams.regSabun = row.regSabun || ''
+  completedPriceDataParams.regNm = row.regNm || ''
+  completedPriceDataParams.regDt = row.regDt || ''
+  completedPriceDataParams.stCd = row.stCd || ''
+  completedPriceDataParams.stNm = row.stNm || ''
+  completedPriceDataParams.svyDt = row.svyDt || ''
+  completedPriceDataParams.reason = row.reason || ''
+
+  selectedCode.value = row.cateCd || ''
+  completedPriceDataParams.estimates = row.estimates || []
+
+  if (row.estimates && row.estimates.length > 0) {
+    const minEstimate = row.estimates.reduce((min, curr) => curr.amt < min.amt ? curr : min, row.estimates[0])
+    completedPriceDataParams.bizNo = minEstimate.bizNo || ''
+    completedPriceDataParams.compNm = minEstimate.compNm || ''
+    completedPriceDataParams.amt = minEstimate.amt || ''
+  } else {
+    completedPriceDataParams.bizNo = ''
+    completedPriceDataParams.compNm = ''
+    completedPriceDataParams.amt = ''
+    notyf.error("견적서가 없습니다.")
+  }
+
+  registerFormOpen.value = false
+  priceSearchCheckBoxStatus.value = !!row
+  console.log(row)
+  console.log(completedPriceDataParams.amt)
+}
+
+const showFileInputs = ref(false)
+const fileInputs = ref([
+  { file: null, description: '시행 품의문' },
+  { file: null, description: '소액수의계약서' },
+  { file: null, description: '수의계약 체결 제한 여부 확인서' },
+  { file: null, description: '퇴직자 재직여부 확인서' },
+  { file: null, description: '인지세 납부확인서' },
+  { file: null, description: '정부권장정책 이행 구매 검토서' },
+  { file: null, description: '기타' }
+])
+
+function handleFileChange(e, idx) {
+  const files = e.target.files
+  if (files && files.length > 0) {
+    fileInputs.value[idx].file = files[0]
+  } else {
+    fileInputs.value[idx].file = null
+  }
+}
+
+
+
+
 </script>
 
 <template>
@@ -116,10 +202,10 @@ const contractPeriod = computed(() => {
               <td>분야</td>
               <td>
                 <span class="colum">
-                  <VField class="pr-2">
+                  <VField class="">
                     <VCodeSelect
                       v-model="selectedCode"
-                      cd_grp="5/"
+                      cd_grp="5"
                     /></VField>
                 </span>
               </td>
@@ -136,28 +222,19 @@ const contractPeriod = computed(() => {
                   title="계약관리 등록"
                   size="contract-big"
                   actions="right"
-                  @submit.prevent="registerFormOpen = false"
-                  @close="registerFormOpen = false"
                 >
                   <template #content>
                     <div class="modal-form">
                       <ComVFlexTable
-                        :data="data.priceSearchData"
+                        :data="data.completedPriceSearchData"
                         :columns="params.modalColumn"
                         :compact="true"
                         :separators="true"
+                        @row-click="handlePriceRowClick"
+                        clickable
                       />
                     </div>
                   </template>
-                  <template #action>
-                    <VButton
-                      type="submit"
-                      color="primary"
-                      raised
-                    >
-                      Save Changes
-                    </VButton>
-                  </template>
                 </VModal>
               </td>
               <td>
@@ -166,6 +243,7 @@ const contractPeriod = computed(() => {
                     <VCheckbox
                       label="가격조사여부"
                       color="info"
+                      v-model="priceSearchCheckBoxStatus"
                     />
                   </VControl>
                 </VField>
@@ -175,7 +253,7 @@ const contractPeriod = computed(() => {
                   <VField>
                     <VControl>
                       <input
-                        v-model="params.reason"
+                        v-model="completedPriceDataParams.reason"
                         class="input custom-text-filter"
                         placeholder="가격조사 안했을 시 예외 사유 입력(필수)"
                       >
@@ -190,7 +268,7 @@ const contractPeriod = computed(() => {
                 <VField>
                   <VControl>
                     <input
-                      v-model="params.title"
+                      v-model="completedPriceDataParams.title"
                       class="input custom-text-filter"
                       placeholder="계약명"
                     >
@@ -204,7 +282,7 @@ const contractPeriod = computed(() => {
                 <VField>
                   <VControl>
                     <input
-                      v-model="params.regNm"
+                      v-model="completedPriceDataParams.bizNo"
                       class="input custom-text-filter"
                       placeholder="사업자번호"
                     >
@@ -215,7 +293,7 @@ const contractPeriod = computed(() => {
                 <VField>
                   <VControl>
                     <input
-                      v-model="params.compNm"
+                      v-model="completedPriceDataParams.compNm"
                       class="input custom-text-filter"
                       placeholder="업체명"
                     >
@@ -249,7 +327,7 @@ const contractPeriod = computed(() => {
                 <VField>
                   <VControl>
                     <input
-                      v-model="params.signDt"
+                      :value="formatDate(completedPriceDataParams.regSdat)"
                       class="input custom-text-filter"
                       placeholder="계약체결일"
                     >
@@ -283,7 +361,7 @@ const contractPeriod = computed(() => {
                 <VField>
                   <VControl>
                     <input
-                      v-model="params.contAmt"
+                      v-model="completedPriceDataParams.amt"
                       class="input custom-text-filter"
                       placeholder="금액"
                     >
@@ -311,7 +389,7 @@ const contractPeriod = computed(() => {
                 <div>
                   <div>
                     <VDatePicker
-                      v-model="params.regSdt"
+                      v-model="completedPriceDataParams.regSdat"
                       color="green"
                       trim-weeks
                     >
@@ -333,10 +411,10 @@ const contractPeriod = computed(() => {
                 </div>
               </td>
               <td colspan="1">
-                <div class="pr-2">
+                <div class="">
                   <div>
                     <VDatePicker
-                      v-model="params.regEdt"
+                      v-model="completedPriceDataParams.regEdat"
                       color="green"
                       trim-weeks
                     >
@@ -364,20 +442,36 @@ const contractPeriod = computed(() => {
             <tr>
               <td>첨부파일</td>
               <td colspan="1">
-                <VButton color="info">
+                <VButton color="info" @click="showFileInputs = !showFileInputs">
                   등록
                 </VButton>
+                </td>
+              <td colspan="5">
+                <!-- 첨부파일 입력영역: 등록 버튼 클릭 시 토글 -->
+                <div v-if="showFileInputs" class="file-upload-list" style="margin-top:10px;">
+                  <div
+                      v-for="(input, idx) in fileInputs"
+                      :key="idx"
+                      style="display: flex; align-items: center; margin-bottom: 8px;"
+                  >
+                    <!-- 파일선택 -->
+                    <label class="file-label" style="margin-right: 10px;">
+                      <input
+                          type="file"
+                          class="file-input"
+                          @change="e => handleFileChange(e, idx)"
+                      />
+                      <span class="file-cta">파일선택</span>
+                    </label>
+                    <span style="flex:1; margin-right: 10px;">{{ input.file ? input.file.name : '첨부된 파일 없음' }}</span>
+                    <span style="flex:2; color: #666;">{{ input.description }}</span>
+                  </div>
+                </div>
               </td>
-              <td colspan="5" />
             </tr>
           </tbody>
         </table>
         <div class="bottom-button">
-          <VButton
-            to="/app/DocumentManagement"
-          >
-            전 표 (임시)
-          </VButton>
           <VButton>저 장</VButton>
           <VButton>취 소</VButton>
         </div>
@@ -389,11 +483,14 @@ const contractPeriod = computed(() => {
 <style scoped lang="scss">
 .table tbody td {
   color: var(--smoke-white);
-
 }
-
 .datatable-table  {
-  padding: 12px 12px;
+  td{
+    font-family: var(--font),serif;
+    vertical-align: middle;
+    padding: 4px 12px;
+    border-bottom: 1px solid var(--fade-grey);
+  }
 
   td:nth-child(1) {
     background-color: var(--primary);
@@ -432,4 +529,16 @@ const contractPeriod = computed(() => {
 .field {
   margin-bottom: 0px;
 }
+
+.file-label {
+  cursor: pointer;
+}
+.file-input {
+  display: none;
+}
+.file-cta {
+  background: #eee;
+  padding: 4px 12px;
+  border-radius: 4px;
+}
 </style>