svcm/dmz
1
0
Fork 0
mirror of https://git.hmsn.ink/kospo/svcm/dmz.git synced 2026-03-20 08:13:42 +09:00
Code Issues Packages Projects Releases Wiki Activity

디자인 변경

Browse Source
This commit is contained in:
bangae1
2025-05-26 20:59:58 +09:00
parent 09d97cbb0b
commit 6a69773dd6
9 changed files with 223 additions and 533 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/pages/contract/ContractList.vue
View File

@@ -232,7 +232,7 @@ watch(selUser, (value) => {
}
.table-container {
border-radius: 10px;
border-radius: 0.3rem;
border: 1px solid var(--fade-grey);
thead {
background-color: var(--primary) !important;
@@ -247,8 +247,6 @@ watch(selUser, (value) => {
}
}
.datatable-toolbar {
//display: flex;
align-items: center;
@@ -256,7 +254,7 @@ watch(selUser, (value) => {
background-color: var(--white);
border: 1px solid var(--fade-grey);
border-radius: 0.75rem;
padding: 20px;
padding: 15px;
color: var(--modal-text);
&.is-reversed {
flex-direction: row-reverse;

168
src/components/pages/contract/ContractSave.vue
View File

@@ -87,53 +87,12 @@ watch(pbAtts.value, (newValue) => {
class="form-layout"
>
<div class="form-body">
<!--Fieldset-->
<!-- <div class="form-fieldset">-->
<!-- <div class="form-outer">-->
<!-- <div class="fieldset-heading">-->
<!-- <h4>업체정보</h4>-->
<!-- </div>-->
<!-- <div class="columns is-multiline">-->
<!-- <div class="column is-12">-->
<!-- <VField>-->
<!-- <VLabel>회사명</VLabel>-->
<!-- <VControl>-->
<!-- <div class="content">-->
<!-- <p>{{ user.compNm }}</p>-->
<!-- </div>-->
<!-- </VControl>-->
<!-- </VField>-->
<!-- </div>-->
<!-- <div class="column is-6">-->
<!-- <VField>-->
<!-- <VLabel>사업자번호</VLabel>-->
<!-- <VControl>-->
<!-- <div class="content">-->
<!-- <p>{{ user.bizNo }}</p>-->
<!-- </div>-->
<!-- </VControl>-->
<!-- </VField>-->
<!-- </div>-->
<!-- <div class="column is-6">-->
<!-- <VField>-->
<!-- <VLabel>대표자명</VLabel>-->
<!-- <VControl>-->
<!-- <div class="content">-->
<!-- <p>{{ user.repNm }}</p>-->
<!-- </div>-->
<!-- </VControl>-->
<!-- </VField>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!--Fieldset-->
<div class="form-fieldset">
<div class="form-outer">
<div class="fieldset-heading">
<h4>가격조사</h4>
</div>
<div class="columns is-multiline">
<div class="columns">
<div class="column is-6">
<VField horizontal>
<VLabel>No</VLabel>
@@ -154,6 +113,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>제목</VLabel>
@@ -164,6 +125,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>내용</VLabel>
@@ -176,6 +139,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>등록기간</VLabel>
@@ -186,6 +151,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField>
<VLabel>첨부파일</VLabel>
@@ -310,120 +277,5 @@ watch(pbAtts.value, (newValue) => {
<style lang="scss" scoped>
@import '/@src/scss/abstracts/all';
@import '/@src/scss/components/forms-outer';
.form-layout {
max-width: 1000px;
margin: 0 auto;
}
.form-fieldset {
max-width: 786px;
animation: fadeInLeft 0.5s;
}
input {
width: 120px !important;
}
.file-cta {
padding-left:0em;
padding-right:0em;
}
.file-icon {
margin: 0px;
}
.datatable-table {
tr {
border: 1px solid var(--fade-grey);
td {
border: 0px;
}
}
}
ul {
list-style-type: none;
}
.file-delete {
font-size: 10px;
padding-left:5px;
}
.label {
font-size: 1rem;
font-weight: bold;
}
.fieldset-heading {
border-bottom: 1px solid var(--fade-grey) !important;
padding-bottom: 10px !important;
h4 {
font-size: 1.3em;
color: var(--modal-text) !important;
}
}
.form-outer {
padding: 20px !important;
border: 1px solid var(--fade-grey) !important;
background-color: var(--modal-background) !important;
}
.form-fieldset {
max-width: 90%;
}
.field{
label {
color: var(--modal-text) !important;
font-weight:bold !important;
}
p {
font-weight: lighter !important;
}
}
.is-horizontal {
padding: 10px 0;
label {
width: 100px;
}
}
.estimate-file-wrapper {
display:flex;
justify-content: space-between;
border:1px solid #ccc;
border-radius:5px;
padding:10px 20px;
margin-bottom:10px;
.estimate-file-download, .estimate-file-delete {
font-size: 20px;
line-height: 40px;
padding-left: 30px;
cursor: pointer;
}
.estimate-file-img {
font-size: 40px;
padding-right: 50px;
}
.estimate-file-name {
width: 400px;
line-height: 40px;
}
.estimate-file-size {
width: 150px;
line-height: 40px;
}
}
.file-trigger {
margin-left: 10px;
height:15px;
padding:10px 10px;
}
@import '/@src/scss/components/custom-contract';
</style>

127
src/components/pages/contract/ContractView.vue
View File

@@ -133,7 +133,7 @@ watch(pbAtts.value, (newValue) => {
<div class="fieldset-heading">
<h4>가격조사</h4>
</div>
<div class="columns is-multiline">
<div class="columns">
<div class="column is-6">
<VField horizontal>
<VLabel>No</VLabel>
@@ -154,6 +154,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>제목</VLabel>
@@ -164,6 +166,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>내용</VLabel>
@@ -176,6 +180,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>등록기간</VLabel>
@@ -186,6 +192,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField>
<VLabel>첨부파일</VLabel>
@@ -266,120 +274,5 @@ watch(pbAtts.value, (newValue) => {
<style lang="scss" scoped>
@import '/@src/scss/abstracts/all';
@import '/@src/scss/components/forms-outer';
.form-layout {
max-width: 1000px;
margin: 0 auto;
}
.form-fieldset {
max-width: 786px;
animation: fadeInLeft 0.5s;
}
input {
width: 120px !important;
}
.file-cta {
padding-left:0em;
padding-right:0em;
}
.file-icon {
margin: 0px;
}
.datatable-table {
tr {
border: 1px solid var(--fade-grey);
td {
border: 0px;
}
}
}
ul {
list-style-type: none;
}
.file-delete {
font-size: 10px;
padding-left:5px;
}
.label {
font-size: 1rem;
font-weight: bold;
}
.fieldset-heading {
border-bottom: 1px solid var(--fade-grey) !important;
padding-bottom: 10px !important;
h4 {
font-size: 1.3em;
color: var(--modal-text) !important;
}
}
.form-outer {
padding: 20px !important;
border: 1px solid var(--fade-grey) !important;
background-color: var(--modal-background) !important;
}
.form-fieldset {
max-width: 90%;
}
.field{
label {
color: var(--modal-text) !important;
font-weight:bold !important;
}
p {
font-weight: lighter !important;
}
}
.is-horizontal {
padding: 10px 0;
label {
width: 100px;
}
}
.estimate-file-wrapper {
display:flex;
justify-content: space-between;
border:1px solid #ccc;
border-radius:5px;
padding:10px 20px;
margin-bottom:10px;
.estimate-file-download, .estimate-file-delete {
font-size: 20px;
line-height: 40px;
padding-left: 30px;
cursor: pointer;
}
.estimate-file-img {
font-size: 40px;
padding-right: 50px;
}
.estimate-file-name {
width: 400px;
line-height: 40px;
}
.estimate-file-size {
width: 150px;
line-height: 40px;
}
}
.file-trigger {
margin-left: 10px;
height:15px;
padding:10px 10px;
}
@import '/@src/scss/components/custom-contract';
</style>

14
src/components/pages/estimate/EstimateList.vue
View File

@@ -119,7 +119,7 @@ function onTabLeave(e: any) {
<thead>
<th>No</th>
<th>제목</th>
<th>조사금액</th>
<th class="text-right">조사금액</th>
<th>담당자</th>
<th>등록일시</th>
<th>진행상태</th>
@@ -141,7 +141,7 @@ function onTabLeave(e: any) {
</div>
</div>
</td>
<td>{{ estimate.totAmt.toString().replace(regex.currency, ',') }}</td>
<td class="text-right">{{ estimate.totAmt.toString().replace(regex.currency, ',') }}</td>
<td>{{ estimate.mngNm }}</td>
<td>{{ dateFormat.millisecondsRemove(estimate.estDt) }}</td>
<td>{{ estimate.estStat }} <span v-if="estimate.estStatCd === '0300' || estimate.estStatCd === '0400'">({{ dateFormat.converterDate(estimate.svyDt) }})</span></td>
@@ -184,6 +184,10 @@ function onTabLeave(e: any) {
</template>
<style lang="scss">
.text-right {
text-align:right !important;
}
.is-navbar {
.datatable-toolbar {
padding-top: 30px;
@@ -191,12 +195,14 @@ function onTabLeave(e: any) {
}
.table-container {
border-radius: 10px;
border-radius: 0.3rem;
border: 1px solid var(--fade-grey);
thead {
background-color: var(--primary) !important;
th {
color: #fff;
text-align:center !important;
border: 1px solid #ededed;
}
}
}
@@ -320,7 +326,7 @@ function onTabLeave(e: any) {
vertical-align: middle;
padding: 12px 20px;
border-bottom: 1px solid var(--fade-grey);
//border: 1px solid var(--fade-grey);
&:last-child {
text-align: right;
}

136
src/components/pages/estimate/EstimateUpdate.vue
View File

@@ -160,7 +160,7 @@ watch(pbAtts.value, (newValue) => {
<h4>가격조사</h4>
</div>
<div class="columns is-multiline">
<div class="columns">
<div class="column is-6">
<VField horizontal>
<VLabel>No</VLabel>
@@ -181,6 +181,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>제목</VLabel>
@@ -191,6 +193,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>내용</VLabel>
@@ -203,6 +207,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>등록기간</VLabel>
@@ -213,6 +219,8 @@ watch(pbAtts.value, (newValue) => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField>
<VLabel>첨부파일</VLabel>
@@ -333,130 +341,6 @@ watch(pbAtts.value, (newValue) => {
<style lang="scss" scoped>
@import '/@src/scss/abstracts/all';
@import '/@src/scss/components/forms-outer';
@import '/@src/scss/components/custom-contract';
.form-layout {
max-width: 1000px;
margin: 0 auto;
}
.form-fieldset {
max-width: 786px;
animation: fadeInLeft 0.5s;
}
input {
width: 120px !important;
}
.file-cta {
padding-left:0em;
padding-right:0em;
}
.file-icon {
margin: 0px;
}
tr {
border: 1px solid var(--fade-grey);
td {
border: 0px;
}
}
.file-delete {
font-size: 10px;
padding-left:5px;
}
a.mouse-pointer {
text-decoration: none;
}
.file-download {
color: var(--light-text);
&:hover {
color: var(--primary);
}
}
.label {
font-size: 1rem;
font-weight: bold;
}
.fieldset-heading {
border-bottom: 1px solid var(--fade-grey) !important;
padding-bottom: 10px !important;
h4 {
font-size: 1.3em;
color: var(--modal-text) !important;
}
}
.form-outer {
padding: 20px !important;
border: 1px solid var(--fade-grey) !important;
background-color: var(--modal-background) !important;
}
.form-fieldset {
max-width: 90%;
}
.field{
label {
color: var(--modal-text) !important;
font-weight:bold !important;
}
p {
font-weight: lighter !important;
}
}
.is-horizontal {
padding: 10px 0;
label {
width: 100px;
}
}
.estimate-file-wrapper {
display:flex;
justify-content: space-between;
border:1px solid #ccc;
border-radius:5px;
padding:10px 20px;
margin-bottom:10px;
.estimate-file-download, .estimate-file-delete {
font-size: 15px;
line-height: 40px;
padding-left: 30px;
cursor: pointer;
}
.estimate-file-img {
font-size: 40px;
padding-right: 50px;
}
.estimate-file-name {
width: 400px;
line-height: 40px;
}
.estimate-file-size {
width: 200px;
line-height: 40px;
}
}
.estimate-file-download, .estimate-file-delete, .fa-plus-circle {
&:hover {
color: var(--primary);
}
}
.file-trigger {
margin-left: 10px;
height:15px;
padding:10px 10px;
}
</style>

139
src/components/pages/estimate/EstimateView.vue
View File

@@ -1,5 +1,6 @@
<script setup lang="ts">
import type { iDtlSpec, iEstimate, UserData, iPbAtt } from '/@src/utils/types'
import regex from '/@src/utils/regex'
const props = defineProps<{
estimate: iEstimate
@@ -112,7 +113,7 @@ const totPrc = computed(() => {
<h4>가격조사</h4>
</div>
<div class="columns is-multiline">
<div class="columns">
<div class="column is-6">
<VField horizontal>
<VLabel>No</VLabel>
@@ -123,6 +124,8 @@ const totPrc = computed(() => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-6">
<VField horizontal>
<VLabel>분야</VLabel>
@@ -133,6 +136,8 @@ const totPrc = computed(() => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>제목</VLabel>
@@ -143,6 +148,8 @@ const totPrc = computed(() => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>내용</VLabel>
@@ -155,6 +162,8 @@ const totPrc = computed(() => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField horizontal>
<VLabel>등록기간</VLabel>
@@ -165,6 +174,8 @@ const totPrc = computed(() => {
</VControl>
</VField>
</div>
</div>
<div class="columns">
<div class="column is-12">
<VField>
<VLabel>첨부파일</VLabel>
@@ -236,7 +247,7 @@ const totPrc = computed(() => {
<th>규격</th>
<th>수량</th>
<th>단위</th>
<th>단가</th>
<th class="text-right">단가</th>
<th>금액</th>
</thead>
<tbody v-for="(dtl, index) in props.estimate.dtlSpecs" :key="dtl.dtlSpNo">
@@ -246,8 +257,8 @@ const totPrc = computed(() => {
<td>{{ dtl.spec }}</td>
<td>{{ dtl.qty }}</td>
<td>{{ dtl.unit }}</td>
<td>{{ estimates[index].unitPrc }}</td>
<td>{{ totPrc[index] || 0 }}</td>
<td class="text-right">{{ String(estimates[index].unitPrc).replace(regex.currency, ',') }}</td>
<td>{{ String(totPrc[index]).replace(regex.currency, ',') || 0 }}</td>
</tr>
</tbody>
</table>
@@ -266,124 +277,6 @@ const totPrc = computed(() => {
<style lang="scss" scoped>
@import '/@src/scss/abstracts/all';
@import '/@src/scss/components/forms-outer';
@import '/@src/scss/components/custom-contract';
.form-layout {
max-width: 1000px;
margin: 0 auto;
}
.form-fieldset {
max-width: 786px;
animation: fadeInLeft 0.5s;
}
input {
width: 120px !important;
}
.file-cta {
padding-left:0em;
padding-right:0em;
}
.file-icon {
margin: 0px;
}
tr {
border: 1px solid var(--fade-grey);
td {
border: 0px;
}
}
.file-delete {
font-size: 10px;
padding-left:5px;
}
a.mouse-pointer {
text-decoration: none;
}
.file-download {
color: var(--light-text);
&:hover {
color: var(--primary);
}
}
.label {
font-size: 1rem;
font-weight: bold;
}
.fieldset-heading {
border-bottom: 1px solid var(--fade-grey) !important;
padding-bottom: 10px !important;
h4 {
font-size: 1.3em;
color: var(--modal-text) !important;
}
}
.form-outer {
padding: 20px !important;
border: 1px solid var(--fade-grey) !important;
background-color: var(--modal-background) !important;
}
.form-fieldset {
max-width: 90%;
}
.field{
label {
color: var(--modal-text) !important;
font-weight:bold !important;
}
p {
font-weight: lighter !important;
}
}
.is-horizontal {
padding: 10px 0;
label {
width: 100px;
}
}
.estimate-file-wrapper {
display:flex;
justify-content: space-between;
border:1px solid #ccc;
border-radius:5px;
padding:10px 20px;
margin-bottom:10px;
.estimate-file-download, .estimate-file-delete {
font-size: 20px;
line-height: 40px;
padding-left: 30px;
cursor: pointer;
}
.estimate-file-img {
font-size: 40px;
padding-right: 50px;
}
.estimate-file-name {
width: 400px;
line-height: 40px;
}
.estimate-file-size {
width: 150px;
line-height: 40px;
}
}
.estimate-file-download, .estimate-file-delete, .fa-plus-circle {
&:hover {
color: var(--primary);
}
}
</style>

162
src/scss/components/_custom-contract.scss Normal file
View File

@@ -0,0 +1,162 @@
.form-outer {
.columns {
border: 1px solid #ccc;
.column {
padding: 0 !important;
.field {
padding: 0 !important;
.label {
padding: 8px !important;
//padding: 0 !important;
margin: 0 !important;
background-color: var(--primary);
color: #fff !important;
}
.control {
padding: 8px !important;
}
}
}
}
}
.form-layout {
max-width: 1000px;
margin: 0 auto;
}
.form-fieldset {
max-width: 786px;
animation: fadeInLeft 0.5s;
}
input {
width: 120px !important;
}
.file-cta {
padding-left:0em;
padding-right:0em;
}
.file-icon {
margin: 0px;
}
.datatable-table {
th {
padding: 10px !important;
border: 1px solid #ededed;
}
tr {
padding: 10px !important;
border: 1px solid var(--fade-grey);
td {
padding: 5px 10px !important;
border: 1px solid #ededed;
input {
height: 2.5em;
}
}
}
}
ul {
list-style-type: none;
}
.file-delete {
font-size: 10px;
padding-left:5px;
}
a.mouse-pointer {
text-decoration: none;
}
.file-download {
color: var(--light-text);
&:hover {
color: var(--primary);
}
}
.label {
font-size: 1rem;
font-weight: bold;
}
.fieldset-heading {
border-bottom: 1px solid var(--fade-grey) !important;
padding-bottom: 10px !important;
h4 {
font-size: 1.3em;
color: var(--modal-text) !important;
}
}
.form-outer {
padding: 20px !important;
border: 1px solid var(--fade-grey) !important;
background-color: var(--modal-background) !important;
}
.form-fieldset {
max-width: 90%;
}
.field{
label {
color: var(--modal-text) !important;
font-weight:bold !important;
}
p {
font-weight: lighter !important;
}
}
.is-horizontal {
padding: 10px 0;
label {
width: 100px;
}
}
.estimate-file-wrapper {
display:flex;
justify-content: space-between;
border:1px solid #ccc;
border-radius:5px;
padding:0px 20px;
margin-bottom:10px;
.estimate-file-download, .estimate-file-delete {
font-size: 20px;
line-height: 40px;
padding-left: 30px;
cursor: pointer;
}
.estimate-file-img {
font-size: 40px;
padding-right: 50px;
}
.estimate-file-name {
width: 400px;
line-height: 40px;
}
.estimate-file-size {
width: 150px;
line-height: 40px;
}
}
.estimate-file-download, .estimate-file-delete, .fa-plus-circle {
&:hover {
color: var(--primary);
}
}
.file-trigger {
margin-left: 10px;
height:15px;
padding:10px 10px;
}

2
src/scss/css-variables/_colors.scss
View File

@@ -70,6 +70,7 @@
--dark-text: #283252;
--light-text: #a2a5b9;
--modal-text: #283252;
--modal-text-reverse: #fff;
// Additional colors
--secondary: #336aeb;
--purple: #8168b1;
@@ -90,6 +91,7 @@
--border: color-mix(in oklab, var(--dark-sidebar), white 12%);
--dark-text: #0b0d13;
--modal-text: #fff;
--modal-text-reverse: #283252;
--placeload-nuance-from: rgb(255 255 255 / 15%);
--placeload-nuance-to: rgb(255 255 255 / 24%);

2
src/scss/css-variables/_rtl.scss
View File

@@ -2,7 +2,7 @@
:root {
--transform-direction: 1;
zoom:1.2;
zoom:1.1;
}
[dir='rtl'] {