diff --git a/package.json b/package.json index 42267eb..a4b9df0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "billing-wise", - "version": "1.0.0", + "version": "1.0.1", "private": true, "type": "module", "scripts": { diff --git a/src/assets/scss/common.scss b/src/assets/scss/common.scss index 30b37ff..835d2ff 100644 --- a/src/assets/scss/common.scss +++ b/src/assets/scss/common.scss @@ -1,7 +1,7 @@ $light-theme-color: rgba(130, 112, 190, 0.7); $theme-color: rgb(130, 112, 190); $input-color: #6C7F98; -$back-color: #EBEBEB; +$back-color: rgb(235, 235, 235, 0.5); $success-color: rgb(44, 128, 206); $waiting-color: #DFD93B; $warning-color: rgb(255, 99, 71); @@ -66,11 +66,9 @@ $mobile-header-height : 100px; } @mixin root-container { - background: $back-color; - width: 100%; + min-width: 100%; min-height: 100%; - height: 100%; - overflow: auto; + box-sizing: border-box; } diff --git a/src/assets/scss/component/table.scss b/src/assets/scss/component/table.scss index 22fb911..998b512 100644 --- a/src/assets/scss/component/table.scss +++ b/src/assets/scss/component/table.scss @@ -14,6 +14,7 @@ background: white; width: 100%; flex-grow: 1; + min-height: 700px; overflow:auto; border-radius: 5px; } diff --git a/src/assets/scss/contract/choose-box.scss b/src/assets/scss/contract/choose-box.scss index 0604f44..b3e1fdb 100644 --- a/src/assets/scss/contract/choose-box.scss +++ b/src/assets/scss/contract/choose-box.scss @@ -1,8 +1,7 @@ .right-side { @include flex-box(column, space-between, 20px); position: relative; - width: 100%; - min-width: 800px; + height: 100%; } .right-side-header { diff --git a/src/components/auth/AuthLoading.vue b/src/components/auth/AuthLoading.vue new file mode 100644 index 0000000..0a7c0c8 --- /dev/null +++ b/src/components/auth/AuthLoading.vue @@ -0,0 +1,26 @@ + + + + + \ No newline at end of file diff --git a/src/components/common/ExcelUpload.vue b/src/components/common/ExcelUpload.vue index 640d853..61abfde 100644 --- a/src/components/common/ExcelUpload.vue +++ b/src/components/common/ExcelUpload.vue @@ -18,8 +18,8 @@
{{ errorMsg }}
- + \ No newline at end of file diff --git a/src/components/common/TheSideBar.vue b/src/components/common/TheSideBar.vue index 828fd82..156d75c 100644 --- a/src/components/common/TheSideBar.vue +++ b/src/components/common/TheSideBar.vue @@ -40,13 +40,14 @@ export default { \ No newline at end of file diff --git a/src/components/common/info/TitleInfo.vue b/src/components/common/info/TitleInfo.vue index ed55880..91750d7 100644 --- a/src/components/common/info/TitleInfo.vue +++ b/src/components/common/info/TitleInfo.vue @@ -12,7 +12,7 @@ export default { name: 'TitleInfoVue', props: { 'title' : String, - 'info': String, + 'info': [String, Number], }, } @@ -20,7 +20,6 @@ export default { \ No newline at end of file diff --git a/src/components/common/input/InfoInput.vue b/src/components/common/input/InfoInput.vue index 4ac74fd..b0c805c 100644 --- a/src/components/common/input/InfoInput.vue +++ b/src/components/common/input/InfoInput.vue @@ -26,7 +26,6 @@ export default { \ No newline at end of file diff --git a/src/components/common/select/TitleSelect.vue b/src/components/common/select/TitleSelect.vue index 4c7bc60..b0909b8 100644 --- a/src/components/common/select/TitleSelect.vue +++ b/src/components/common/select/TitleSelect.vue @@ -59,7 +59,6 @@ export default { .title-select { @include flex-box(row, center, 0px); - background-color: white; width: 100%; height: 40px; @@ -82,6 +81,7 @@ export default { border: $theme-color solid; border-top-right-radius: 5px; border-bottom-right-radius: 5px; + background-color: white; } } @@ -94,7 +94,7 @@ export default { @include flex-box(row, space-between, 10px); @include base-icon(); width: 100%; - padding: 7px 15px; + padding: 7px 0px; background: none; border: none; font-weight: bold @@ -104,6 +104,6 @@ export default { @include flex-box(column, center, 10px); @include select-list; top: calc(100% + 10px); - width:90% + width:90%; } \ No newline at end of file diff --git a/src/components/common/select/TitleUpSelect.vue b/src/components/common/select/TitleUpSelect.vue new file mode 100644 index 0000000..9719d29 --- /dev/null +++ b/src/components/common/select/TitleUpSelect.vue @@ -0,0 +1,109 @@ + + + + + \ No newline at end of file diff --git a/src/components/consent/modal/ConsentCreateModal.vue b/src/components/consent/modal/ConsentCreateModal.vue index 201f662..b16a207 100644 --- a/src/components/consent/modal/ConsentCreateModal.vue +++ b/src/components/consent/modal/ConsentCreateModal.vue @@ -11,7 +11,12 @@ ※ 동의 서명 이미지 파일을 등록해주세요 - + @@ -24,6 +29,8 @@ import ModalHeaderVue from '@/components/common/modal/ModalHeader.vue'; import ModalFooterVue from '@/components/common/modal/ModalFooter.vue'; import InfoInputVue from '@/components/common/input/InfoInput.vue'; +import TitleSelectVue from '@/components/common/select/TitleSelect.vue'; +import TitleUpSelectVue from '@/components/common/select/TitleUpSelect.vue'; import { createConsent } from '@/utils/consent'; import { mapStores } from 'pinia'; import { useContractDetailStore } from '@/stores/contract/contractDetail'; @@ -34,6 +41,8 @@ export default { ModalHeaderVue, ModalFooterVue, InfoInputVue, + TitleSelectVue, + TitleUpSelectVue }, props: { 'isVisible': Boolean, @@ -47,7 +56,16 @@ export default { bank: '', number: '', imgFile: null, - imgSrc: null + imgSrc: null, + bankIdx: 0, + bankList: [ + { value: 'KB', name: '국민은행' }, + { value: 'SH', name: '신한은행' }, + { value: 'WR', name: '우리은행' }, + { value: 'HN', name: '하나은행' }, + { value: 'NH', name: '농협은행' }, + { value: 'IBK', name: '기업은행' }, + ] } }, computed: { @@ -58,6 +76,11 @@ export default { triggerFileInput() { this.$refs.fileInput.click(); }, + // 은행 선택 + selectBank(idx) { + this.bankIdx = idx; + this.bank = this.bankList[this.bankIdx].name; + }, // 이미지 등록 onImageChange(event) { const file = event.target.files[0]; diff --git a/src/components/consent/modal/ConsentUpdateModal.vue b/src/components/consent/modal/ConsentUpdateModal.vue index 4490a03..06ec937 100644 --- a/src/components/consent/modal/ConsentUpdateModal.vue +++ b/src/components/consent/modal/ConsentUpdateModal.vue @@ -11,7 +11,12 @@ ※ 동의 서명 이미지 파일을 등록해주세요 - + @@ -24,6 +29,7 @@ import ModalHeaderVue from '@/components/common/modal/ModalHeader.vue'; import ModalFooterVue from '@/components/common/modal/ModalFooter.vue'; import InfoInputVue from '@/components/common/input/InfoInput.vue'; +import TitleUpSelectVue from '@/components/common/select/TitleUpSelect.vue'; import { editConsent, editConsentImage } from '@/utils/consent'; import { mapStores } from 'pinia'; import { useContractDetailStore } from '@/stores/contract/contractDetail'; @@ -35,6 +41,7 @@ export default { ModalHeaderVue, ModalFooterVue, InfoInputVue, + TitleUpSelectVue }, props: { 'isVisible': Boolean, @@ -48,7 +55,16 @@ export default { bank: '', number: '', imgFile: null, - imgSrc: null + imgSrc: null, + bankIdx: 0, + bankList: [ + { value: 'KB', name: '국민은행' }, + { value: 'SH', name: '신한은행' }, + { value: 'WR', name: '우리은행' }, + { value: 'HN', name: '하나은행' }, + { value: 'NH', name: '농협은행' }, + { value: 'IBK', name: '기업은행' }, + ] } }, computed: { @@ -65,9 +81,15 @@ export default { async showData() { this.owner = this.consentDetailStore.data.owner; this.bank = this.consentDetailStore.data.bank; + this.bankIdx = this.bankList.findIndex((bank) => bank.name === this.consentDetailStore.data.bank); this.number = this.consentDetailStore.data.number; this.imgSrc = this.consentDetailStore.data.signUrl; }, + // 은행 선택 + selectBank(idx) { + this.bankIdx = idx; + this.bank = this.bankList[this.bankIdx].name; + }, // 이미지 업로드 triggerFileInput() { this.$refs.fileInput.click(); diff --git a/src/components/contract/ContractCreateInfo.vue b/src/components/contract/ContractCreateInfo.vue index 55df5ba..a39546f 100644 --- a/src/components/contract/ContractCreateInfo.vue +++ b/src/components/contract/ContractCreateInfo.vue @@ -14,8 +14,8 @@ 상품 정보
- - + +
@@ -23,16 +23,28 @@ :class="{ 'info-box': true, 'active': contractCreateStore.step === 2 }"> 계약 정보
- - + +
- - + +
- - + +
@@ -41,15 +53,63 @@ diff --git a/src/components/contract/ContractEditInfo.vue b/src/components/contract/ContractEditInfo.vue index 5878e3e..0951138 100644 --- a/src/components/contract/ContractEditInfo.vue +++ b/src/components/contract/ContractEditInfo.vue @@ -21,16 +21,28 @@ :class="{ 'info-box': true, 'active': contractCreateStore.step === 2 }"> 계약 정보
- - + +
- - + +
- - + +
@@ -39,17 +51,23 @@ diff --git a/src/components/contract/ContractInfo.vue b/src/components/contract/ContractInfo.vue index 3797bda..058077e 100644 --- a/src/components/contract/ContractInfo.vue +++ b/src/components/contract/ContractInfo.vue @@ -36,7 +36,7 @@
- +
@@ -50,6 +50,7 @@ import { mapStores } from 'pinia'; import { useContractDetailStore } from '@/stores/contract/contractDetail'; import { toDateFromDateTime } from '@/utils/formatter'; +import { useConsentDetailStore } from '@/stores/contract/consentDetail'; import TitleInfoVue from '../common/info/TitleInfo.vue'; export default { @@ -58,6 +59,7 @@ export default { TitleInfoVue }, computed: { + ...mapStores(useConsentDetailStore), ...mapStores(useContractDetailStore), subscription() { return this.contractDetailStore.data.subscription? '정기': '단기'; @@ -71,6 +73,15 @@ export default { updatedAt() { return toDateFromDateTime(this.contractDetailStore.data.updatedAt); }, + isConsentExist() { + if (this.contractDetailStore.data.paymentType.id === 1) { + return '불필요'; + } else if (this.consentDetailStore.isExist) { + return '등록 완료'; + } else { + return '등록 대기' + } + } }, } diff --git a/src/components/contract/create/ContractChooseInfo.vue b/src/components/contract/create/ContractChooseInfo.vue index 560b504..454c99b 100644 --- a/src/components/contract/create/ContractChooseInfo.vue +++ b/src/components/contract/create/ContractChooseInfo.vue @@ -44,30 +44,6 @@ export default { TitleSelectVue, InfoInputVue, }, - data() { - return { - isSubscriptionIdx: 0, - isSubscription: [ - { name: '정기', value: 'true' }, - { name: '단기', value: 'false' }, - ], - invoiceTypeIdx: 0, - invoiceType: [ - { name: '자동 청구', value: 1 }, - { name: '수동 청구', value: 2 }, - ], - paymentTypeIdx: 0, - paymentType: [ - { name: '납부자 결제', value: 1 }, - { name: '실시간 CMS', value: 2 }, - ], - isEasyConsentIdx: 0, - isEasyConsent: [ - { name: '미사용', value: false }, - { name: '사용', value: true }, - ] - } - }, computed: { ...mapStores(useContractCreateStore), contractCycle: { diff --git a/src/components/contract/create/ContractChooseItem.vue b/src/components/contract/create/ContractChooseItem.vue index a63c194..d0882fb 100644 --- a/src/components/contract/create/ContractChooseItem.vue +++ b/src/components/contract/create/ContractChooseItem.vue @@ -2,10 +2,6 @@
-
- - -
@@ -13,17 +9,15 @@ + + \ No newline at end of file diff --git a/src/stores/auth.js b/src/stores/auth.js index d71b8f5..0df91eb 100644 --- a/src/stores/auth.js +++ b/src/stores/auth.js @@ -5,17 +5,30 @@ import { defineStore } from 'pinia' export const useAuthStore = defineStore('auth', { state() { return { - isLoggedIn: false + isLoggedIn: false, + data: { + clientId: 0, + clientName : '', + clientPhone : '', + userEmail : '', + userId : 0, + userName : '홍길동', + userPhone : '01011111111' + }, } }, actions: { login() { + this.$reset(); this.isLoggedIn = true; }, logout() { authAxios.post('auth/logout'); this.isLoggedIn = false; router.push({name: 'login'}) + }, + setUserData(data) { + this.data = data } }, persist: { diff --git a/src/stores/contract/contractBulk.js b/src/stores/contract/contractBulk.js index 88c5178..e5fa195 100644 --- a/src/stores/contract/contractBulk.js +++ b/src/stores/contract/contractBulk.js @@ -4,7 +4,8 @@ export const useContractBulkStore = defineStore('contractBulk', { state() { return { exampleImg: 'example_contract.png', - download: '계약등록.xlsx', + download: 'https://t5-bucket.s3.ap-northeast-2.amazonaws.com/excel/%EA%B3%84%EC%95%BD%EB%93%B1%EB%A1%9D.xlsx', + fileName: '계약등록.xlsx', file: null, uploadData: null, errorList: [], diff --git a/src/stores/contract/contractCreate.js b/src/stores/contract/contractCreate.js index 802b415..a82c88c 100644 --- a/src/stores/contract/contractCreate.js +++ b/src/stores/contract/contractCreate.js @@ -36,8 +36,7 @@ export const useContractCreateStore = defineStore('contractCreate', { ], isEasyConsentIdx: 0, isEasyConsent: [ - { name: '미사용', value: false }, - { name: '사용', value: true }, + { name: '불필요', value: false }, ] } }, @@ -74,6 +73,17 @@ export const useContractCreateStore = defineStore('contractCreate', { }, setPaymentType(idx) { this.paymentTypeIdx = idx; + if (idx === 0) { + this.isEasyConsentIdx = 0; + this.isEasyConsent = [ + { name: '불필요', value: false }, + ] + } else { + this.isEasyConsent = [ + { name: '미사용', value: false }, + { name: '사용', value: true }, + ] + } }, setIsEasyConsent(idx) { this.isEasyConsentIdx = idx diff --git a/src/stores/contract/contractDetail.js b/src/stores/contract/contractDetail.js index c7b0cb7..d378192 100644 --- a/src/stores/contract/contractDetail.js +++ b/src/stores/contract/contractDetail.js @@ -4,42 +4,49 @@ export const useContractDetailStore = defineStore('contractDetail', { state() { return { data: { - "id": null, - "member": { - "id": null, - "name": null, - "phone": null, - "email": null + id: null, + member: { + id: null, + name: null, + phone: null, + email: null }, - "item": { - "id": null, - "name": null, - "price": null, - "amount": null + item: { + id: null, + name: null, + price: null, + amount: null }, - "chargeAmount": null, - "totalChargeAmount": null, - "totalUnpaidAmount": null, - "invoiceType": { - "id": null, - "name": null + chargeAmount: null, + totalChargeAmount: null, + totalUnpaidAmount: null, + invoiceType: { + id: null, + name: null }, - "paymentType": { - "id": null, - "name": null + paymentType: { + id: null, + name: null }, - "contractCycle": null, - "paymentDueCycle": null, - "createdAt": null, - "updatedAt": null, - "subscription": null, - "easyConsent": null + contractStatus: { + id: null, + name: null + }, + contractCycle: null, + paymentDueCycle: null, + createdAt: null, + updatedAt: null, + subscription: null, + easyConsent: null } } }, actions: { setData(data) { - this.data = data; + this.data = data }, + setContractStatus(data) { + this.data.contractStatus = data + } } -}) \ No newline at end of file +}) diff --git a/src/stores/contract/contractList.js b/src/stores/contract/contractList.js index e2bf4d5..1321409 100644 --- a/src/stores/contract/contractList.js +++ b/src/stores/contract/contractList.js @@ -18,7 +18,7 @@ export const useContractListStore = defineStore('contractList', { { data: 'invoiceType', name: '청구 생성',}, { data: 'contractStatus', name: '계약 상태',}, { data: 'paymentType', name: '결제 수단',}, - { data: 'totalUnpaidCount', name: '미납 여부',} + { data: 'totalUnpaidCount', name: '미납 건수',} ], filters: [ {data: 'itemId', value: null}, diff --git a/src/stores/invoice/invoiceList.js b/src/stores/invoice/invoiceList.js index d2ddb37..5e72c08 100644 --- a/src/stores/invoice/invoiceList.js +++ b/src/stores/invoice/invoiceList.js @@ -14,7 +14,7 @@ export const useInvoiceListStore = defineStore('invoiceList', { { data: 'itemName', name: '상품명', notSortable: true}, { data: 'memberName', name: '회원명', notSortable: true}, { data: 'chargeAmount', name: '금액',}, - { data: 'contractDate', name: '약정일',}, + { data: 'contractDate', name: '결제일',}, { data: 'dueDate', name: '납부 기한',}, { data: 'createdAt', name: '생성일',}, { data: 'paymentType', name: '결제 수단',}, diff --git a/src/stores/member/memberBulk.js b/src/stores/member/memberBulk.js index b7b9618..7c62e89 100644 --- a/src/stores/member/memberBulk.js +++ b/src/stores/member/memberBulk.js @@ -4,7 +4,8 @@ export const useMemberBulkStore = defineStore('memberBulk', { state() { return { exampleImg: 'example_member.png', - download: '회원등록.xlsx', + download: 'https://t5-bucket.s3.ap-northeast-2.amazonaws.com/excel/%ED%9A%8C%EC%9B%90%EB%93%B1%EB%A1%9D.xlsx', + fileName: '회원등록.xlsx', file: null, uploadData: null, errorList: [], diff --git a/src/utils/contract.js b/src/utils/contract.js index 863a63d..3c2bc31 100644 --- a/src/utils/contract.js +++ b/src/utils/contract.js @@ -119,4 +119,24 @@ async function deleteContract(contractId) { return result; } -export {getContractList, getContract, createContract, createContractBulk, editContract, deleteContract} \ No newline at end of file +// 계약 상태 변경 +async function editContractStatus(contractId, statusId) { + const result = await mainAxios.put(`contracts/${contractId}/status`, statusId); + + if (result.code === 200) { + let contractName = null; + + if (statusId === 3) { + contractName = '종료' + } else if (statusId === 2) { + contractName = '진행' + } + + const data = { id: statusId, name: contractName }; + contractDetailStore.setContractStatus(data); + } + + return result; +} + +export {getContractList, getContract, createContract, createContractBulk, editContract, deleteContract, editContractStatus} \ No newline at end of file diff --git a/src/utils/item.js b/src/utils/item.js index 98584cd..cfcf68b 100644 --- a/src/utils/item.js +++ b/src/utils/item.js @@ -10,7 +10,7 @@ async function getItemList() { let url = `items?page=${itemStore.page}&size=${itemStore.size}`; if (itemStore.search.value) { - url += `&${itemStore.search.keyword}=${itemStore.search.valu}` + url += `&${itemStore.search.keyword}=${itemStore.search.value}` } itemStore.columns.forEach(column => { diff --git a/src/views/MainView.vue b/src/views/MainView.vue index e9ee385..9a7d956 100644 --- a/src/views/MainView.vue +++ b/src/views/MainView.vue @@ -1,5 +1,5 @@ diff --git a/src/views/auth/SignupView.vue b/src/views/auth/SignupView.vue index 68cd0ae..4805705 100644 --- a/src/views/auth/SignupView.vue +++ b/src/views/auth/SignupView.vue @@ -63,8 +63,10 @@ import AuthBtnInputVue from '@/components/auth/AuthBtnInput.vue'; import AuthButtonVue from '@/components/auth/AuthButton.vue' import AuthInputVue from '@/components/auth/AuthInput.vue' +import { useLoadingStore } from '@/stores/error/loading'; import { InputValue, ValidationTimer } from '@/utils/auth'; import { authAxios } from '@/utils/axios'; +import { mapStores } from 'pinia'; export default { name: 'LoginView', @@ -122,6 +124,9 @@ export default { this.clientCode.errorMsg = ''; } }, + computed: { + ...mapStores(useLoadingStore), + }, methods: { // 메서드 : 이메일 중복 검사 async emailDuplicationCheck() { @@ -141,7 +146,9 @@ export default { // 전송 로직 if (!this.emailCodeSend) { const data = { "email": this.email.value }; + this.loadingStore.setIsLoading(true); const result = await authAxios.post('auth/email/code', data); + this.loadingStore.setIsLoading(false); if (result.code === 200) { this.emailCodeSend = true; this.emailCodeTimer = new ValidationTimer(this.emailCode); @@ -166,7 +173,9 @@ export default { // 전송 로직 if (!this.phoneCodeSend) { const data = { 'phone': this.phone.value }; + this.loadingStore.setIsLoading(true); const result = await authAxios.post('auth/phone/code', data); + this.loadingStore.setIsLoading(false); if (result.code === 200) { this.phoneCodeSend = true; this.phoneCodeTimer = new ValidationTimer(this.phoneCode); diff --git a/src/views/contract/ContractCreateView.vue b/src/views/contract/ContractCreateView.vue index 94a3efb..458ba97 100644 --- a/src/views/contract/ContractCreateView.vue +++ b/src/views/contract/ContractCreateView.vue @@ -18,7 +18,6 @@
- @@ -89,13 +88,13 @@ export default { .left-side { @include flex-box(column, space-between, 20px); - min-width: 700px; - width: 40%; + width: 700px; height: 100%; padding: 40px 50px; border-radius: 10px; box-shadow: $base-shadow; background-color: white; + transition: all 0.5s; .btn-box { @include flex-box(row, center, 60px); diff --git a/src/views/contract/ContractDetailView.vue b/src/views/contract/ContractDetailView.vue index 1859e43..ed891f3 100644 --- a/src/views/contract/ContractDetailView.vue +++ b/src/views/contract/ContractDetailView.vue @@ -9,7 +9,13 @@
- 현재 계약 관련 청구 +
+
+ {{ contractDetailStore.data.contractStatus.name }} +
+
+ 현재 계약 관련 청구 +
@@ -17,6 +23,8 @@ v-if="canCreateInvoice()" /> + +
@@ -26,7 +34,7 @@
- @@ -43,13 +51,15 @@ import ThemeIconBtnVue from '@/components/common/btn/ThemeIconBtn.vue' import InvoiceCreateModalVue from '@/components/contract/modal/InvoiceCreateModal.vue' import ConsentCreateModalVue from '@/components/consent/modal/ConsentCreateModal.vue' import ConsentUpdateModalVue from '@/components/consent/modal/ConsentUpdateModal.vue' +import WarningBtnVue from '@/components/common/btn/WarningBtn.vue' +import SuccessBtnVue from '@/components/common/btn/SuccessBtn.vue' import { mapStores } from 'pinia' import { useContractCreateStore } from '@/stores/contract/contractCreate' import { useInvoiceListStore } from '@/stores/invoice/invoiceList' import { useConsentDetailStore } from '@/stores/contract/consentDetail' import { useContractDetailStore } from '@/stores/contract/contractDetail' import { getConsent } from '@/utils/consent' -import { getContract } from '@/utils/contract' +import { editContractStatus, getContract } from '@/utils/contract' export default { @@ -64,7 +74,9 @@ export default { ThemeIconBtnVue, InvoiceCreateModalVue, ConsentCreateModalVue, - ConsentUpdateModalVue + ConsentUpdateModalVue, + WarningBtnVue, + SuccessBtnVue }, data() { return { @@ -79,7 +91,20 @@ export default { ...mapStores(useContractDetailStore), ...mapStores(useContractCreateStore), ...mapStores(useInvoiceListStore), - ...mapStores(useConsentDetailStore) + ...mapStores(useConsentDetailStore), + contractstatus() { + const stats = this.contractDetailStore.data.contrac + }, + contractStatsClass() { + const id = this.contractDetailStore.data.contractStatus.id + if (id === 1) { + return 'waiting'; + } else if (id === 2) { + return 'success'; + } else { + return 'warning'; + } + }, }, methods: { operateDeleteModal(value) { @@ -103,6 +128,13 @@ export default { canEditConsent() { return this.contractDetailStore.data.paymentType.id === 2 && this.consentDetailStore.isExist; }, + // 계약 상태 변경 + async editContractStatus(statusId) { + const result = await editContractStatus(this.$route.params.id, statusId); + if (result.code !== 200) { + // 예외 처리 + } + } }, async created() { this.consentDetailStore.$reset(); @@ -122,16 +154,15 @@ export default { @import "../../assets/scss/component/table.scss"; .root-container { - @include flex-box(row, space-between, 100px); + @include flex-box(row, center, 60px); @include root-container; - height: auto; - padding: 60px 130px; + height: 100%; + padding: 30px 50px; } .left-side { @include flex-box(column, space-between, 20px); - min-width: 700px; - width: 40%; + width: 650px; min-height: 100%; padding: 40px 50px; border-radius: 10px; @@ -146,18 +177,37 @@ export default { .right-side { @include flex-box(column, space-between, 20px); - position: relative; - width: 100%; + width: 900px; height: 100%; .right-header { @include flex-box(row, space-between, 20px); width: 100%; - .contract-title { - left: 50%; - font-size: 24px; + .haeder-left { + @include flex-box(row, start, 15px); font-weight: bold; + + .contract-title { + left: 50%; + font-size: 22px; + + } + + .contract-status { + @include flex-box(row, start, 5px); + padding: 5px 7px; + background: white; + border-radius: 20px; + border: solid 2px $theme-color; + + div { + width: 10px; + height: 10px; + border-radius: 50%; + } + } + } .right-btn-box { @@ -165,4 +215,16 @@ export default { } } } + +.waiting { + background-color: $waiting-color; +} + +.success { + background-color: $success-color; +} + +.warning { + background-color: $warning-color; +} \ No newline at end of file diff --git a/src/views/contract/ContractEditView.vue b/src/views/contract/ContractEditView.vue index 2e98a73..f482ad1 100644 --- a/src/views/contract/ContractEditView.vue +++ b/src/views/contract/ContractEditView.vue @@ -3,12 +3,11 @@
{{ warningMsg }}
-
+
-
diff --git a/src/views/contract/ContractListView.vue b/src/views/contract/ContractListView.vue index c473671..9ae7a36 100644 --- a/src/views/contract/ContractListView.vue +++ b/src/views/contract/ContractListView.vue @@ -1,14 +1,16 @@ @@ -39,10 +41,10 @@ export default { }, methods: { routeCreate() { - this.$router.push({name: 'contractCreate'}); + this.$router.push({ name: 'contractCreate' }); }, - routeCreateBulk(){ - this.$router.push({name: 'contractCreateBulk'}); + routeCreateBulk() { + this.$router.push({ name: 'contractCreateBulk' }); }, async getContractList() { const result = await getContractList(); @@ -75,16 +77,23 @@ export default { .root-container { @include flex-box(column, space-between, 20px); @include root-container; + width: fit-content; height: 100%; - padding: 30px 40px + padding: 30px 40px; + + .main-container { + @include flex-box(column, center, 30px); + width: 1600px; + height: 100%; + } } .top-btn-box { @include flex-box(row, space-between, 0px); width: 100%; + .btn-box { @include flex-box(row, space-between, 20px); } } - diff --git a/src/views/home/HomeView.vue b/src/views/home/HomeView.vue index 43932c6..b9cf70e 100644 --- a/src/views/home/HomeView.vue +++ b/src/views/home/HomeView.vue @@ -1,22 +1,26 @@