gitadmin/sk_fems_ui
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' of http://218.237.212.51:30003/gitadmin/sk_fems_ui into dev-dungtv-screen2

Browse Source
This commit is contained in:
leonard
2025-07-23 15:57:24 +07:00
parent dd9739bf74 ab702c4495
commit bcf4015cae
10 changed files with 501 additions and 482 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/scss/common/tabs.scss
View File

@ -72,7 +72,7 @@
$config, $config,
#{$theme}, #{$theme},
"v-tabs-hover-color" "v-tabs-hover-color"
) !important ) !important;
} }
&:not(.v-tab--active){ &:not(.v-tab--active){

4
assets/scss/var.scss
View File

@ -120,7 +120,7 @@ $config: (
v-tabs-active-border-color: rgba(255, 255, 255, 0.7), v-tabs-active-border-color: rgba(255, 255, 255, 0.7),
v-dialog-card-text-color: #fff, v-dialog-card-text-color: #fff,
tui-datepicker-backgroundColor: #0d0f17, tui-datepicker-backgroundColor: #0d0f17,
tui-datepicker-border-color: rgb(66, 66, 66), tui-datepicker-border-color: rgba(255, 255, 255, 0.3),
tui-datepicker-selectable-hover-color: #2d3355, tui-datepicker-selectable-hover-color: #2d3355,
tui-datepicker-selected-color: #1a4e87, tui-datepicker-selected-color: #1a4e87,
tui-datepicker-calendar-color: #fff, tui-datepicker-calendar-color: #fff,
@ -252,7 +252,7 @@ $config: (
v-tabs-hover-color: #1677FF, v-tabs-hover-color: #1677FF,
v-dialog-card-text-color: #111, v-dialog-card-text-color: #111,
tui-datepicker-backgroundColor: #fff, tui-datepicker-backgroundColor: #fff,
tui-datepicker-border-color: #D9D9D9, tui-datepicker-border-color: #b4b8c9,
tui-datepicker-selectable-hover-color: #e1e7f3, tui-datepicker-selectable-hover-color: #e1e7f3,
tui-datepicker-selected-color: #4777d9, tui-datepicker-selected-color: #4777d9,
tui-datepicker-calendar-color: #111, tui-datepicker-calendar-color: #111,

8
components/common/Calendar.vue
View File

@ -170,9 +170,11 @@ export default {
month : month, month : month,
day : day day : day
} }
this.$refs['planPop'].blocId = this.pageData.blocMstrList[ // BEGIN TEST UI
this.pageData.blocId // this.$refs['planPop'].blocId = this.pageData.blocMstrList[
].blocId; // this.pageData.blocId
// ].blocId;
// END TEST UI
this.$refs['planPop'].dialog = true; this.$refs['planPop'].dialog = true;
}, },
updatePlan(val) { updatePlan(val) {

393
components/common/modal/PlanPop.vue
View File

@ -1,268 +1,195 @@
<template> <template>
<div> <div>
<!-- <v-btn :ripple="false" @click="dialog = !dialog">경고창</v-btn> --> <!-- <v-btn :ripple="false" @click="dialog = !dialog">경고창</v-btn> -->
<v-dialog <v-dialog v-model="dialog" width="800" overlay-color="#000" overlay-opacity="0.8">
v-model="dialog"
width="700"
overlay-color="#000"
overlay-opacity="0.8"
>
<v-card> <v-card>
<v-toolbar <v-card-title class="px-6 py-4 d-flex align-center justify-space-between">
<span class="custom-title-4">{{ label }}</span>
<a-button icon="close" type="text" @click="dialog = !dialog"></a-button>
</v-card-title>
<!-- <v-toolbar
:color="isDarkMode ? '#2d3355' : '#3f4d7d'" :color="isDarkMode ? '#2d3355' : '#3f4d7d'"
class="py-4 pr-3 pl-5" class="py-4 pr-3 pl-5"
height="auto" height="auto"
> >
<v-toolbar-title>{{ label }}</v-toolbar-title> <v-toolbar-title>{{ label }}</v-toolbar-title>
<!-- <v-btn </v-toolbar> -->
icon
tile
small
:ripple="false"
@click="dialog = !dialog"
:style="{ backgroundColor: isDarkMode ? '#2d3355' : '#3f4d7d' }"
>
<v-icon>mdi-close</v-icon>
</v-btn> -->
</v-toolbar>
<!-- <v-card-title> <!-- <v-card-title>
일정 상세 내용 일정 상세 내용
</v-card-title> --> </v-card-title> -->
<!-- <template v-for="(item, index) in detailList"> --> <!-- <template v-for="(item, index) in detailList"> -->
<template> <template>
<div style="padding : 20px"> <div class="pa-6 pt-0">
<v-row no-gutters class="mb-4">
<v-col :cols="12"> <v-col :cols="12">
<v-row>
<v-col :cols="3">
<v-row class="search-box" align="center" no-gutters>
<label class="search-box-label"> <label class="search-box-label">
<v-icon x-small color="#fb8200" class="mr-1" <v-icon small :class="['mr-1', 'icon-orange']">$icoBulletPoint</v-icon>
>mdi-record-circle</v-icon
>
일정 시작 일정 시작
</label> </label>
</v-row>
</v-col> </v-col>
<v-col :cols="4"> <v-col :cols="6" class="py-0 pr-2">
<!-- <DatePicker v-model="strtDt" :parentPrgmId="parentPrgmId"/> --> <!-- <DatePicker v-model="strtDt" :parentPrgmId="parentPrgmId"/> -->
<div class="startpicker-container2"> <div class="startpicker-container2">
<v-text-field <v-text-field id="startpicker2" ref="startpicker2" v-model="strtDt"
id="startpicker2" :class="'v-input__custom'" :hide-details="true" readonly outlined>
ref="startpicker2"
v-model="strtDt"
:class="'v-input__custom'"
:hide-details="true"
readonly
outlined
>
<template #append> <template #append>
<v-icon size="20">$icoCalendar</v-icon> <v-icon size="20">$icoCalendar</v-icon>
</template> </template>
<template #append-outer> <template #append-outer>
<div <div ref="startpicker-container2" id="startpicker-container2"></div>
ref="startpicker-container2"
id="startpicker-container2"
></div>
</template> </template>
</v-text-field> </v-text-field>
</div> </div>
</v-col> </v-col>
<v-col :cols="2"> <v-col :cols="6" class="py-0 pl-2">
<vue-numeric-input <!-- <DatePicker v-model="strtDt" :parentPrgmId="parentPrgmId"/> -->
v-model="strtHh" <div class="startpicker-container2">
:min="0" <v-text-field id="startpicker2" ref="startpicker2" v-model="strtDt"
:max="23" :class="'v-input__custom'" :hide-details="true" readonly outlined>
controls-type="updown" <template #append>
class="v-input__slot" <v-icon size="20">$icoCalendar</v-icon>
width="100%" </template>
align="center" <template #append-outer>
> <div ref="startpicker-container2" id="startpicker-container2"></div>
</template>
</v-text-field>
</div>
</v-col>
<!-- <v-col :cols="2">
<vue-numeric-input v-model="strtHh" :min="0" :max="23" controls-type="updown"
class="v-input__slot" width="100%" align="center">
</vue-numeric-input> </vue-numeric-input>
</v-col> </v-col>
<v-col :cols="1" style="text-align: center;"> <v-col :cols="1" style="text-align: center;">
: :
</v-col> </v-col>
<v-col :cols="2"> <v-col :cols="2">
<vue-numeric-input <vue-numeric-input v-model="strtMm" :min="0" :max="59" controls-type="updown"
v-model="strtMm" class="v-input__slot" width="100%" align="center">
:min="0"
:max="59"
controls-type="updown"
class="v-input__slot"
width="100%"
align="center"
>
</vue-numeric-input> </vue-numeric-input>
</v-col> </v-col> -->
</v-row> </v-row>
<v-row> <v-row no-gutters class="mb-4">
<v-col :cols="3"> <v-col :cols="12">
<v-row class="search-box" align="center" no-gutters>
<label class="search-box-label"> <label class="search-box-label">
<v-icon x-small color="#fb8200" class="mr-1" <v-icon small :class="['mr-1', 'icon-orange']">$icoBulletPoint</v-icon>
>mdi-record-circle</v-icon
>
일정 종료 일정 종료
</label> </label>
</v-row>
</v-col> </v-col>
<v-col :cols="4"> <v-col :cols="6" class="pr-2">
<!-- <DatePicker v-model="endDt" :parentPrgmId="parentPrgmId"/> --> <!-- <DatePicker v-model="endDt" :parentPrgmId="parentPrgmId"/> -->
<div class="startpicker-container3"> <div class="startpicker-container3">
<v-text-field <v-text-field id="startpicker3" ref="startpicker3" v-model="endDt"
id="startpicker3" :class="'v-input__custom'" :hide-details="true" readonly outlined>
ref="startpicker3"
v-model="endDt"
:class="'v-input__custom'"
:hide-details="true"
readonly
outlined
>
<template #append> <template #append>
<v-icon size="20">$icoCalendar</v-icon> <v-icon size="20">$icoCalendar</v-icon>
</template> </template>
<template #append-outer> <template #append-outer>
<div <div ref="startpicker-container3" id="startpicker-container3"></div>
ref="startpicker-container3"
id="startpicker-container3"
></div>
</template> </template>
</v-text-field> </v-text-field>
</div> </div>
</v-col> </v-col>
<v-col :cols="2"> <v-col :cols="6" class="pl-2">
<vue-numeric-input <div class="startpicker-container3">
v-model="endHh" <v-text-field id="startpicker3" ref="startpicker3" v-model="endDt"
:min="0" :class="'v-input__custom'" :hide-details="true" readonly outlined>
:max="23" <template #append>
controls-type="updown" <v-icon size="20">$icoCalendar</v-icon>
class="v-input__slot" </template>
width="100%" <template #append-outer>
align="center" <div ref="startpicker-container3" id="startpicker-container3"></div>
> </template>
</v-text-field>
</div>
</v-col>
<!-- <v-col :cols="2">
<vue-numeric-input v-model="endHh" :min="0" :max="23" controls-type="updown"
class="v-input__slot" width="100%" align="center">
</vue-numeric-input> </vue-numeric-input>
</v-col> </v-col>
<v-col :cols="1" style="text-align: center;"> <v-col :cols="1" style="text-align: center;">
: :
</v-col> </v-col>
<v-col :cols="2"> <v-col :cols="2">
<vue-numeric-input <vue-numeric-input v-model="endMm" :min="0" :max="59" controls-type="updown"
v-model="endMm" class="v-input__slot" width="100%" align="center">
:min="0"
:max="59"
controls-type="updown"
class="v-input__slot"
width="100%"
align="center"
>
</vue-numeric-input> </vue-numeric-input>
</v-col> </v-col> -->
</v-row> </v-row>
<v-row> <v-row no-gutters class="mb-4">
<v-col :cols="3"> <v-col :cols="12">
<v-row class="search-box" align="center" no-gutters>
<label class="search-box-label"> <label class="search-box-label">
<v-icon x-small color="#fb8200" class="mr-1" <v-icon small :class="['mr-1', 'icon-orange']">$icoBulletPoint</v-icon>
>mdi-record-circle</v-icon
>
일정 제목 일정 제목
</label> </label>
</v-row>
</v-col> </v-col>
<v-col :cols="9"> <v-col :cols="12" class="py-0">
<v-text-field <v-text-field v-model="planTitle" class="v-input__custom" outlined
v-model="planTitle" :hide-details="true"></v-text-field>
class="v-input__custom"
outlined
:hide-details="true"
></v-text-field>
</v-col> </v-col>
</v-row> </v-row>
<v-row> <v-row no-gutters class="mb-4">
<v-col :cols="3"> <v-col :cols="12">
<v-row class="search-box" align="center" no-gutters>
<label class="search-box-label"> <label class="search-box-label">
<v-icon x-small color="#fb8200" class="mr-1" <v-icon small :class="['mr-1', 'icon-orange']">$icoBulletPoint</v-icon>
>mdi-record-circle</v-icon
>
일정 상세 내용 일정 상세 내용
</label> </label>
</v-row>
</v-col> </v-col>
<v-col :cols="9"> <v-col :cols="12" class="py-0">
<v-textarea <v-textarea v-model="planCntn" class="v-input__custom" outlined :hide-details="true"
v-model="planCntn" :maxlength="1000"></v-textarea>
class="v-input__custom"
outlined
:hide-details="true"
:maxlength="1000"
></v-textarea>
</v-col> </v-col>
</v-row> </v-row>
<v-row> <v-row no-gutters class="mb-4">
<v-col :cols="3"> <v-col :cols="12">
<v-row class="search-box" align="center" no-gutters> <label class="search-box-label">
<v-icon x-small color="#fb8200" class="mr-1" <v-icon small :class="['mr-1', 'icon-orange']">$icoBulletPoint</v-icon>
>mdi-record-circle</v-icon
>
표시 색상 표시 색상
</v-row> </label>
</v-col> </v-col>
<v-col :cols="1"> <v-col :cols="6">
<div <div class="d-flex calendar-color" style="gap:16px">
id="redDiv"
class="colPk redBg" <div id="redDiv" class="colPk redBg" @click="colorClick('red')">
@click="colorClick('red')" <div class="inner-color"></div>
></div> </div>
</v-col>
<v-col :cols="1"> <div id="blueDiv" class="colPk blueBg" @click="colorClick('blue')">
<div <div class="inner-color"></div>
id="blueDiv" </div>
class="colPk blueBg"
@click="colorClick('blue')"
></div> <div id="pupleDiv" class="colPk pupleBg" @click="colorClick('puple')">
</v-col> <div class="inner-color"></div>
<v-col :cols="1"> </div>
<div
id="pupleDiv"
class="colPk pupleBg" <div id="greenDiv" class="colPk greenBg" @click="colorClick('green')">
@click="colorClick('puple')" <div class="inner-color"></div>
></div> </div>
</v-col>
<v-col :cols="1">
<div <div id="orangeDiv" class="colPk orangeBg" @click="colorClick('orange')">
id="greenDiv" <div class="inner-color"></div>
class="colPk greenBg" </div>
@click="colorClick('green')"
></div>
</v-col> <div id="pinkDiv" class="colPk pinkBg" @click="colorClick('pink')">
<v-col :cols="1"> <div class="inner-color"></div>
<div </div>
id="orangeDiv"
class="colPk orangeBg" </div>
@click="colorClick('orange')"
></div>
</v-col>
<v-col :cols="1">
<div
id="pinkDiv"
class="colPk pinkBg"
@click="colorClick('pink')"
></div>
</v-col> </v-col>
</v-row> </v-row>
</v-col>
</div> </div>
</template> </template>
<v-card-actions class="justify-end"> <v-card-actions class="justify-end">
<v-btn :ripple="false" @click="btnAction('save')">저장</v-btn> <a-button :ripple="false" @click="btnAction('save')" class="mr-2">저장</a-button>
<v-btn <a-button v-show="popUpAction === 'update'" type="danger" ghost danger :ripple="false"
v-show="popUpAction === 'update'" @click="btnAction('delete')" class="mr-2">삭제</a-button>
:ripple="false" <a-button :ripple="false" type="primary" @click="btnAction('close')" class="mr-2">닫기</a-button>
@click="btnAction('delete')"
>삭제</v-btn
>
<v-btn :ripple="false" @click="btnAction('close')">닫기</v-btn>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
@ -786,46 +713,80 @@ export default {
.v-card__actions { .v-card__actions {
padding-bottom: 30px !important; padding-bottom: 30px !important;
} }
.inner-color {
width: 100%;
height: 100%;
border-radius: 4px;
}
.colPk { .colPk {
width: 25px; width: 28px;
height: 25px; height: 28px;
text-align: center; text-align: center;
border-radius: 5px 5px; border-radius: 6px 6px;
cursor: pointer; cursor: pointer;
padding: 4px
} }
.colPkSelect { .colPkSelect {
border: 2px solid; border: 1px solid #00000073;
} }
.redBg {
.redBg .inner-color {
background-color: rgba(229, 62, 62, var(--bg-opacity)); background-color: rgba(229, 62, 62, var(--bg-opacity));
background-color: #e53e3e; background-color: #FF4D4F;
} }
.blueBg {
.blueBg .inner-color {
background-color: rgba(66, 153, 225, var(--bg-opacity)); background-color: rgba(66, 153, 225, var(--bg-opacity));
background-color: #4299e1; background-color: #597EF7;
} }
.pupleBg {
.pupleBg .inner-color {
background-color: rgba(102, 126, 234, var(--bg-opacity)); background-color: rgba(102, 126, 234, var(--bg-opacity));
background-color: #667eea; background-color: #9254DE;
} }
.greenBg {
.greenBg .inner-color {
background-color: rgba(56, 178, 172, var(--bg-opacity)); background-color: rgba(56, 178, 172, var(--bg-opacity));
background-color: #38b2ac; background-color: #73D13D;
} }
.orangeBg {
.orangeBg .inner-color {
background-color: rgba(237, 137, 54, var(--bg-opacity)); background-color: rgba(237, 137, 54, var(--bg-opacity));
background-color: #ed8936; background-color: #FFA940;
} }
.pinkBg {
.pinkBg .inner-color {
background-color: rgba(237, 100, 166, var(--bg-opacity)); background-color: rgba(237, 100, 166, var(--bg-opacity));
background-color: #ed64a6; background-color: #F759AB;
}
}
.v-input__custom {
&.half {
width: calc(50% - 20px);
}
}
::v-deep {
.tui-timepicker-row {
display: flex;
justify-content: space-around;
background-color: #edf4fc;
.tui-timepicker-column.tui-timepicker-colon {
color: #000 !important;
} }
} }
.startpicker-container2 { .startpicker-container2 {
display: flex;
align-items: center;
justify-content: space-between;
position: relative; position: relative;
.v-input { .v-input {
@ -844,10 +805,8 @@ export default {
} }
} }
.startpicker-container3 { .startpicker-container3 {
display: flex;
align-items: center;
justify-content: space-between;
position: relative; position: relative;
.v-input { .v-input {
@ -865,21 +824,5 @@ export default {
} }
} }
} }
.v-input__custom {
flex: 0 0 auto;
&.half {
width: calc(50% - 20px);
}
}
::v-deep {
.tui-timepicker-row {
display: flex;
justify-content: space-around;
background-color: #edf4fc;
.tui-timepicker-column.tui-timepicker-colon {
color: #000 !important;
}
}
} }
</style> </style>

4
components/pages/ems/EffcIdxInfo/EffcIdxAddInfoTab.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<v-row> <v-row class="mt-3">
<v-col :cols="6" class="py-2 pr-4"> <v-col :cols="6" class="py-2 pr-4">
<InputText ref="effcIdxId" :parentPrgmId="parentPrgmId" label="효율지표 ID" valueNm="effcIdxId" <InputText ref="effcIdxId" :parentPrgmId="parentPrgmId" label="효율지표 ID" valueNm="effcIdxId"
:required="false" :readonly="true" :textCols="12" :labelCols="12" /> :required="false" :readonly="true" :textCols="12" :labelCols="12" />
@ -15,7 +15,7 @@
@update:propsValue="selectValue01 = $event" /> @update:propsValue="selectValue01 = $event" />
</v-col> </v-col>
</v-row> </v-row>
<div class="d-flex align-center justify-space-between pa-5"> <div class="d-flex align-center justify-space-between pt-3 py-2">
<v-card-title class="pa-0 custom-title-4">지표연결정보</v-card-title> <v-card-title class="pa-0 custom-title-4">지표연결정보</v-card-title>
<Buttons :parentPrgmId="parentPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" /> <Buttons :parentPrgmId="parentPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
<component v-show="false" ref="EgrpPysclQtyPop" :is="'EgrpPysclQtyPop'" :parentPrgmId="parentPrgmId" <component v-show="false" ref="EgrpPysclQtyPop" :is="'EgrpPysclQtyPop'" :parentPrgmId="parentPrgmId"

5
pages/comm/auth/MenuMngPage.vue
View File

@ -23,7 +23,7 @@
</v-row> </v-row>
<v-row ref="contents" class="mt-4"> <v-row ref="contents" class="mt-4">
<v-col :cols="6" class="h100"> <v-col :cols="6" class="h100 pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0">메뉴 리스트</v-card-title> <v-card-title class="pa-0">메뉴 리스트</v-card-title>
@ -39,7 +39,7 @@
</div> </div>
</v-card> </v-card>
</v-col> </v-col>
<v-col :cols="6" class="h100"> <v-col :cols="6" class="h100 pl-3">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<v-card-title class="pa-0">메뉴 상세</v-card-title> <v-card-title class="pa-0">메뉴 상세</v-card-title>
@ -480,6 +480,7 @@ const myDetail = [
list: 'sysDivCdList', list: 'sysDivCdList',
itemText: 'commCdNm', itemText: 'commCdNm',
itemValue: 'commCd', itemValue: 'commCd',
iconShow: true,
}, },
{ {
type: 'CheckBox', type: 'CheckBox',

14
pages/comm/base/BatchMngPage.vue
View File

@ -14,7 +14,7 @@
:customClass="'input-large'" /> :customClass="'input-large'" />
</v-col> </v-col>
<v-col :cols="2.5"> <v-col :cols="2.5">
<!-- <component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
:label="'배치 실행 구분'" :label="'배치 실행 구분'"
@ -22,17 +22,17 @@
:sendParam="{ commGrpCd: 'CO_BATCH_EXEC_TP', useFg: '1' }" :sendParam="{ commGrpCd: 'CO_BATCH_EXEC_TP', useFg: '1' }"
:addAll="true" :addAll="true"
:customClass="'select-large'" :customClass="'select-large'"
/> --> />
</v-col> </v-col>
<v-col :cols="2.5"> <v-col :cols="2.5">
<!-- <component <component
:is="'selectCodeList'" :is="'selectCodeList'"
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
:label="'사용여부'" :label="'사용여부'"
:dataKey="'searchUseFg'" :dataKey="'searchUseFg'"
:sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }" :sendParam="{ commGrpCd: 'CO_USEFG', useFg: '1' }"
:customClass="'select-large'" :customClass="'select-large'"
/> --> />
</v-col> </v-col>
<BtnSearch size="large" /> <BtnSearch size="large" />
@ -41,9 +41,9 @@
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents"> <v-row ref="contents" class="mt-4">
<!-- 배치 리스트 --> <!-- 배치 리스트 -->
<v-col :cols="6" class="h100"> <v-col :cols="6" class="h100 pr-2">
<v-card class="pb-5"> <v-card class="pb-5">
<div class="d-flex align-center justify-space-between pa-4"> <div class="d-flex align-center justify-space-between pa-4">
<!-- <v-card-title> <!-- <v-card-title>
@ -64,7 +64,7 @@
</v-card> </v-card>
</v-col> </v-col>
<!-- 배치 상세 --> <!-- 배치 상세 -->
<v-col :cols="6" class="h100"> <v-col :cols="6" class="h100 pl-3">
<v-card class="pd-y-20 h100"> <v-card class="pd-y-20 h100">
<v-card-title class="d-flex justify-space-between align-end pa-4"> <v-card-title class="d-flex justify-space-between align-end pa-4">
<span class="tit ft-size_20 ft-weight_600">배치 상세</span> <span class="tit ft-size_20 ft-weight_600">배치 상세</span>

309
pages/comm/base/CalendarMngPage.vue
View File

@ -3,65 +3,45 @@
<v-row ref="searchFilter"> <v-row ref="searchFilter">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
<v-row align="center" no-gutters> <v-row align="end" no-gutters>
<v-col cols="2"> <v-col cols="3">
<component <component :is="'SelectBlocMstr'" :parentPrgmId="myPrgmId" :sendParam="{ comId }"
:is="'SelectBlocMstr'" :labelCols="12" :textCols="12" :customClass="'select-large'" />
:parentPrgmId="myPrgmId"
:sendParam="{ comId }"
/>
</v-col> </v-col>
<v-col cols="3"> <v-col cols="3">
<!-- <component :is="'SelectDateSolo'" :parentPrgmId="myPrgmId" /> --> <!-- <component :is="'SelectDateSolo'" :parentPrgmId="myPrgmId" /> -->
<DatePicker :parentPrgmId="myPrgmId" :label="'조회연월'" /> <DatePicker :parentPrgmId="myPrgmId" :label="'조회연월'" />
</v-col> </v-col>
<v-col cols="7" class="text-right"> <v-col cols="6" class="text-right">
<v-btn :ripple="false" @click="search()">조회</v-btn> <BtnSearch @click="search()" size="large" />
</v-col> </v-col>
</v-row> </v-row>
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<v-row ref="contents" id="CalendarMngContent"> <v-row ref="contents" id="CalendarMngContent" class="mt-4">
<v-col cols="12" lg="4" class="h100"> <v-col cols="12" lg="4" class="h100 pr-2">
<v-card class="w100"> <v-card class="w100">
<v-card-title class="d-flex justify-space-between align-center"> <v-card-title class="d-flex justify-space-between align-center">
<span class="custom-title-4">캘린더 리스트</span> <span class="custom-title-4">캘린더 리스트</span>
<Buttons <Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :btnActionsFnc="btnActions" />
:parentPrgmId="myPrgmId"
:bindingData="gridName"
:btnActionsFnc="btnActions"
/>
</v-card-title> </v-card-title>
<v-card-actions <v-card-actions class="pt-0 px-5 pb-5" :style="{ height: 'calc(100% - 72.56px)' }">
class="pt-0 px-5 pb-5"
:style="{ height: 'calc(100% - 72.56px)' }"
>
<div ref="gridParent" class="w100 h100"> <div ref="gridParent" class="w100 h100">
<component <component class="w100" :ref="gridName + myPrgmId" :is="loadGrid ? 'Grid' : null"
class="w100" :gridName="gridName" :parentPrgmId="myPrgmId" :editorGrid="true"
:ref="gridName + myPrgmId" @getRowsData="getRowData" :dataPath="dataPathExample" />
:is="loadGrid ? 'Grid' : null"
:gridName="gridName"
:parentPrgmId="myPrgmId"
:editorGrid="true"
@getRowsData="getRowData"
/>
</div> </div>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-col> </v-col>
<v-col cols="12" lg="8" class="h100"> <v-col cols="12" lg="8" class="h100 pl-3">
<v-card> <v-card>
<v-card-title> <v-card-title>
<span class="custom-title-4">캘린더 미리보기</span> <span class="custom-title-4">캘린더 미리보기</span>
</v-card-title> </v-card-title>
<v-card-actions class="px-5" :style="{ height: 'calc(100% - 62px)' }"> <v-card-actions class="px-5 d-block" :style="{ height: 'calc(100% - 62px)' }">
<Calendar <Calendar :parentPrgmId="myPrgmId" :gridName="gridName" :headerVisible="false" />
:parentPrgmId="myPrgmId"
:gridName="gridName"
:headerVisible="false"
/>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-col> </v-col>
@ -75,6 +55,7 @@ import { mapState, mapMutations, mapActions } from 'vuex';
import Utility from '~/plugins/utility'; import Utility from '~/plugins/utility';
import Grid from '~/components/common/Grid'; import Grid from '~/components/common/Grid';
import Buttons from '~/components/common/button/Buttons'; import Buttons from '~/components/common/button/Buttons';
import BtnSearch from '~/components/common/button/BtnSearch';
import SelectBlocMstr from '@/components/common/select/SelectBlocMstr'; import SelectBlocMstr from '@/components/common/select/SelectBlocMstr';
// import SelectDateSolo from "@/components/common/select/SelectDateSolo"; // import SelectDateSolo from "@/components/common/select/SelectDateSolo";
import InputText from '@/components/common/input/InputText'; import InputText from '@/components/common/input/InputText';
@ -107,12 +88,87 @@ export default {
InputText, InputText,
Calendar, Calendar,
DatePicker, DatePicker,
BtnSearch
}, },
data() { data() {
return { return {
myPrgmId: myPrgmId, myPrgmId: myPrgmId,
gridName: 'rowGrid', gridName: 'rowGrid',
loadGrid: false, loadGrid: true,
dataPathExample: {
"rowGrid": {
data: [
{
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-23",
"dtNm": "수요일",
"dt": "2025-07-21",
"dtNm": "월요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-22",
"dtNm": "화요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-24",
"dtNm": "목요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-25",
"dtNm": "금요일",
"hldyFg": "평일",
"hldyNm": ""
},
{
"dt": "2025-07-26",
"dtNm": "토요일",
"hldyFg": "주말",
"hldyNm": ""
},
{
"dt": "2025-07-27",
"dtNm": "일요일",
"hldyFg": "휴일",
"hldyNm": "정기휴일"
}
],
column: [
{
header: '일자',
name: 'dt',
align: 'center',
// formatter({ value }) {
// return value.split(' ')[0];
// },
},
{
header: '요일',
name: 'dtNm',
align: 'center',
// formatter({ value }) {
// return value + '요일';
// },
},
{
header: '구분',
name: 'hldyFg',
align: 'center',
essential: true,
},
{ header: '휴일명', name: 'hldyNm', editor: 'text' },
],
}
},
rowKey: null, rowKey: null,
edtingFinishFlag: 'Y', edtingFinishFlag: 'Y',
}; };
@ -185,16 +241,16 @@ export default {
await this.gridInit(); await this.gridInit();
}, },
async search() { async search() {
await this.getRowGridData(); // await this.getRowGridData();
}, },
async gridInit() { async gridInit() {
const gridHeight = this.$refs.gridParent.offsetHeight - 30; // const gridHeight = this.$refs.gridParent.offsetHeight - 30;
this.setGridOption({ // this.setGridOption({
gridKey: this.gridName, // gridKey: this.gridName,
value: Object.assign(Utility.defaultGridOption(gridHeight), { // value: Object.assign(Utility.defaultGridOption(gridHeight), {
scrollX: false, // scrollX: false,
}), // }),
}); // });
// this.getRowGridData(); // this.getRowGridData();
}, },
@ -294,86 +350,86 @@ export default {
this.loadGrid = false; this.loadGrid = false;
let res = await this.postApiReturn({ // let res = await this.postApiReturn({
apiKey: 'selectWorkCald', // apiKey: 'selectWorkCald',
resKey: 'workcaldData', // resKey: 'workcaldData',
sendParam: { // sendParam: {
blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId, // blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId,
yymm: this.chkFromDt, // yymm: this.chkFromDt,
comId: this.comId, // comId: this.comId,
}, // },
}); // });
let res2 = await this.postApiReturn({ // let res2 = await this.postApiReturn({
apiKey: 'selectWorkCaldDetl', // apiKey: 'selectWorkCaldDetl',
resKey: 'workcaldDetlData', // resKey: 'workcaldDetlData',
sendParam: { // sendParam: {
blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId, // blocId: this.pageData.blocMstrList[this.chkBlocCd].blocId,
yymm: this.chkFromDt, // yymm: this.chkFromDt,
comId: this.comId, // comId: this.comId,
}, // },
}); // });
for (var i = 0; i < res2.length; i++) { // for (var i = 0; i < res2.length; i++) {
if ( // if (
!( // !(
res2[i].hldyNm == null || // res2[i].hldyNm == null ||
res2[i].hldyNm == '토요일' || // res2[i].hldyNm == '토요일' ||
res2[i].hldyNm == '일요일' // res2[i].hldyNm == '일요일'
) // )
) { // ) {
for (var j = i + 1; j < res2.length; j++) { // for (var j = i + 1; j < res2.length; j++) {
if (res2[i].hldyNm == res2[j].hldyNm) { // if (res2[i].hldyNm == res2[j].hldyNm) {
res2[i].hldyNm = ''; // res2[i].hldyNm = '';
} // }
} // }
} // }
} // }
res = res.map(item => { // res = res.map(item => {
const dt = this.$dayjs(item.dt.split(' ')[0]); // YYYY-MM-DD // const dt = this.$dayjs(item.dt.split(' ')[0]); // YYYY-MM-DD
const dtNm = dt.format('ddd'); // 요일 // const dtNm = dt.format('ddd'); // 요일
const newItem = { // const newItem = {
...item, // ...item,
dtNm: dtNm, // dtNm: dtNm,
hldyNm: item.hldyNm ? item.hldyNm : '', // hldyNm: item.hldyNm ? item.hldyNm : '',
rowStat: null, // rowStat: null,
}; // };
return newItem; // return newItem;
}); // });
this.loadGrid = true; // this.loadGrid = true;
this.setPageData({ isFind: false }); // this.setPageData({ isFind: false });
this.setGridColumn({ // this.setGridColumn({
gridKey: this.gridName, // gridKey: this.gridName,
value: myColumns, // value: myColumns,
}); // });
this.setGridData({ // this.setGridData({
gridKey: this.gridName, // gridKey: this.gridName,
value: res, // value: res,
}); // });
this.setPageData({ planData: res2 }); // this.setPageData({ planData: res2 });
// 첫번째 row 선택상태 // // 첫번째 row 선택상태
this.$nextTick(() => { // this.$nextTick(() => {
this.$refs[this.gridName + this.myPrgmId].focus({ // this.$refs[this.gridName + this.myPrgmId].focus({
//rowKey: 0, // //rowKey: 0,
rowKey: // rowKey:
this.pageData.rowGridSelectKey == '' || // this.pageData.rowGridSelectKey == '' ||
this.pageData.rowGridSelectKey == null // this.pageData.rowGridSelectKey == null
? 0 // ? 0
: this.pageData.rowGridSelectKey == // : this.pageData.rowGridSelectKey ==
this.$refs[this.gridName + this.myPrgmId].getData().length - 1 // this.$refs[this.gridName + this.myPrgmId].getData().length - 1
? this.pageData.rowGridSelectKey // ? this.pageData.rowGridSelectKey
: 0, // : 0,
columnName: 'dt', // columnName: 'dt',
setScroll: true, // setScroll: true,
}); // });
this.setPageData({ isFind: false }); // this.setPageData({ isFind: false });
}); // });
}, },
async getRowData(data, gridName) { async getRowData(data, gridName) {
this.setGridSelectData({ this.setGridSelectData({
@ -488,6 +544,7 @@ const defaultData = {
.selectbox:focus { .selectbox:focus {
outline: none; outline: none;
} }
.calendarOption { .calendarOption {
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
@ -501,20 +558,26 @@ select.selectbox {
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; /* 높이 초기화 */ height: 100%;
/* 높이 초기화 */
padding: 0; padding: 0;
margin: 0; margin: 0;
line-height: normal; /* line-height 초기화 */ line-height: normal;
font-family: inherit; /* 폰트 상속 */ /* line-height 초기화 */
font-family: inherit;
/* 폰트 상속 */
border: 0; border: 0;
// opacity: 0; /* 숨기기 */ // opacity: 0; /* 숨기기 */
// filter:alpha(opacity=0); /* IE8 숨기기 */ // filter:alpha(opacity=0); /* IE8 숨기기 */
// -webkit-appearance: none; /* 네이티브 외형 감추기 */ // -webkit-appearance: none; /* 네이티브 외형 감추기 */
// -moz-appearance: none; // -moz-appearance: none;
// appearance: none; // appearance: none;
opacity: 1; /* 숨기기 */ opacity: 1;
filter: alpha(opacity=1); /* IE8 숨기기 */ /* 숨기기 */
-webkit-appearance: auto; /* 네이티브 외형 감추기 */ filter: alpha(opacity=1);
/* IE8 숨기기 */
-webkit-appearance: auto;
/* 네이티브 외형 감추기 */
-moz-appearance: auto; -moz-appearance: auto;
appearance: auto; appearance: auto;
} }

19
pages/ems/base/EqpmGrpPysclQtyMngPage.vue
View File

@ -53,7 +53,7 @@
<v-card class="pb-5 px-4"> <v-card class="pb-5 px-4">
<v-card-title class="px-0">물리량 상세</v-card-title> <v-card-title class="px-0">물리량 상세</v-card-title>
<v-row no-gutters> <v-row no-gutters>
<v-col :cols="12" class="py-3"> <v-col :cols="6" class="py-3 pr-4">
<InputText :parentPrgmId="myPrgmId" label="물리량 ID" valueNm="pysclQtyId" :labelCols="12" <InputText :parentPrgmId="myPrgmId" label="물리량 ID" valueNm="pysclQtyId" :labelCols="12"
:textCols="12" :required="requiredValueList[0]" :disabled="disabledValueList[0]" :textCols="12" :required="requiredValueList[0]" :disabled="disabledValueList[0]"
:readonly="readOnlyValueList[0]" placeholder="시스템 자동입력" /> :readonly="readOnlyValueList[0]" placeholder="시스템 자동입력" />
@ -73,7 +73,7 @@
</v-col> </v-col>
</v-row> </v-row>
<v-row no-gutters> <v-row no-gutters>
<v-col :cols="12" class="py-3"> <v-col :cols="6" class="py-3 pr-4">
<InputText :parentPrgmId="myPrgmId" label="물리량명" valueNm="pysclQtyNm" :labelCols="12" <InputText :parentPrgmId="myPrgmId" label="물리량명" valueNm="pysclQtyNm" :labelCols="12"
:textCols="12" :required="requiredValueList[3]" :disabled="disabledValueList[3]" :textCols="12" :required="requiredValueList[3]" :disabled="disabledValueList[3]"
:readonly="readOnlyValueList[3]" /> :readonly="readOnlyValueList[3]" />
@ -109,7 +109,7 @@
</v-col> </v-col>
</v-row> </v-row>
<v-row no-gutters v-show="argContentShowFlag"> <v-row no-gutters v-show="argContentShowFlag">
<v-col :cols="6" class="py-3"> <v-col :cols="12" class="py-3">
<component :is="'TextArea'" :parentPrgmId="myPrgmId" ref="TextArea" :item="calcDescItem" /> <component :is="'TextArea'" :parentPrgmId="myPrgmId" ref="TextArea" :item="calcDescItem" />
</v-col> </v-col>
</v-row> </v-row>
@ -121,22 +121,19 @@
계산Argument 계산Argument
</label> </label>
</v-col> </v-col>
<v-col :cols="4" class="py-2"> <v-col :cols="6" class="py-2">
<InputText :parentPrgmId="myPrgmId" label="ARG갯수" valueNm="argCnt" :labelCols="12" <InputText :parentPrgmId="myPrgmId" label="ARG갯수" valueNm="argCnt" :labelCols="12"
:textCols="12" :iconShow="true" :required="requiredValueList[7]" :textCols="12" :iconShow="true" :required="requiredValueList[7]"
:disabled="disabledValueList[7]" :readonly="readOnlyValueList[7]" /> :disabled="disabledValueList[7]" :readonly="readOnlyValueList[7]" />
</v-col> </v-col>
<v-col :cols="4"> </v-col> <v-col :cols="4"> </v-col>
<v-col :cols="4" class="py-2" align="right"> <v-col :cols="12" class="py-2" align="right">
<v-btn :ripple="false" @click="btnAction('add')" :disabled="disabledValueList[7]">추가</v-btn> <a-button type="primary" @click="btnAction('add')" class="v-btn-add-text mr-1" icon="plus">추가</a-button>
<!-- <v-btn :ripple="false" @click="btnAction('edit')">수정</v-btn> --> <a-button type="danger" @click="btnAction('remove')" ghost danger icon="delete">삭제</a-button>
<v-btn :ripple="false" @click="btnAction('remove')"
:disabled="disabledValueList[7]">삭제</v-btn>
</v-col> </v-col>
</v-row> </v-row>
<v-row style="height:calc(30% - 76px)" v-show="argContentShowFlag"> <v-row style="height:calc(30% - 76px)" v-show="argContentShowFlag">
<v-col :cols="2"> </v-col> <v-col :cols="12" style="height:100%">
<v-col :cols="10" style="height:100%">
<div ref="gridParent2" style="height:100%"> <div ref="gridParent2" style="height:100%">
<component :ref="gridName2" :is="loadGrid2 ? 'Grid' : null" :gridName="gridName2" <component :ref="gridName2" :is="loadGrid2 ? 'Grid' : null" :gridName="gridName2"
:parentPrgmId="myPrgmId" @getRowsData="getRowData2" :dataPath="dataPathExample2" /> :parentPrgmId="myPrgmId" @getRowsData="getRowData2" :dataPath="dataPathExample2" />

13
store/modules/menu.js
View File

@ -244,6 +244,19 @@ export const actions = {
url: 'comm/base/NoticeMngPage', url: 'comm/base/NoticeMngPage',
lvl: 1 lvl: 1
}, },
{
comId: 'd49',
sysDivCd: 'caalendarmng', //시스템구분
menuId: 'MNU0007', // MENU_ID (메뉴ID)
prgmId: 'PRG0033', // PRGM_ID (프로그램ID)
upMenuId: 'menu3', // UP_MENU_ID (상위메뉴ID)
menuNm: '13. Calendar Manager',// MENU_NM (메뉴명)
sortSeq: 5562, // SORT_SEQ (정렬순서)
useFg: 'caalendarmng',// USE_FG (사용여부)
rmrk: 'caalendarmng',
url: 'comm/base/CalendarMngPage',
lvl: 1
},
{ {
comId: 'd57', comId: 'd57',
sysDivCd: 'energyResource', //시스템구분 sysDivCd: 'energyResource', //시스템구분