mirror of
https://git.hmsn.ink/kospo/svcm/oa.git
synced 2026-03-19 21:15:11 +09:00
Merge branch 'refs/heads/main' into feature/temp
This commit is contained in:
@@ -47,12 +47,13 @@ const classes = computed(() => {
|
|||||||
return ['select', props.multiple && 'is-multiple']
|
return ['select', props.multiple && 'is-multiple']
|
||||||
})
|
})
|
||||||
|
|
||||||
const cdItems = ref<Array<{ cd: string; nm: string }>>([])
|
const cdItems = computed(() => {
|
||||||
|
return detailCode.getCodeList(props.cd_grp)
|
||||||
|
})
|
||||||
|
|
||||||
watch(() => props.cd_grp, async (newVal) => {
|
watch(() => props.cd_grp, async (newVal) => {
|
||||||
if (newVal) {
|
if (newVal) {
|
||||||
await detailCode.setDetailCode(newVal)
|
await detailCode.setDetailCode(newVal)
|
||||||
cdItems.value = detailCode.getCodeList(newVal)
|
|
||||||
}
|
}
|
||||||
}, { immediate: true })
|
}, { immediate: true })
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
648
src/components/app-vuero/VCustomButton.vue
Normal file
648
src/components/app-vuero/VCustomButton.vue
Normal file
@@ -0,0 +1,648 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import type { RouteLocationAsString } from 'unplugin-vue-router'
|
||||||
|
import type { SlotsType, PropType } from 'vue'
|
||||||
|
import { RouterLink } from 'vue-router'
|
||||||
|
|
||||||
|
import VPlaceload from '/@src/components/base/VPlaceload.vue'
|
||||||
|
|
||||||
|
export type VButtonSize = 'medium' | 'big' | 'huge'
|
||||||
|
export type VButtonColor =
|
||||||
|
| 'primary'
|
||||||
|
| 'info'
|
||||||
|
| 'success'
|
||||||
|
| 'warning'
|
||||||
|
| 'danger'
|
||||||
|
| 'white'
|
||||||
|
| 'dark'
|
||||||
|
| 'light'
|
||||||
|
| 'validation'
|
||||||
|
export type VButtonDark = '1' | '2' | '3' | '4' | '5' | '6'
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
props: {
|
||||||
|
to: {
|
||||||
|
type: [Object, String] as PropType<RouteLocationAsString>,
|
||||||
|
default: undefined,
|
||||||
|
},
|
||||||
|
href: {
|
||||||
|
type: String,
|
||||||
|
default: undefined,
|
||||||
|
},
|
||||||
|
icon: {
|
||||||
|
type: String,
|
||||||
|
default: undefined,
|
||||||
|
},
|
||||||
|
iconCaret: {
|
||||||
|
type: String,
|
||||||
|
default: undefined,
|
||||||
|
},
|
||||||
|
placeload: {
|
||||||
|
type: String,
|
||||||
|
default: undefined,
|
||||||
|
validator: (value: string) => {
|
||||||
|
if (value.match(CssUnitRe) === null) {
|
||||||
|
console.warn(
|
||||||
|
`VButton: invalid "${value}" placeload. Should be a valid css unit value.`,
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
},
|
||||||
|
},
|
||||||
|
color: {
|
||||||
|
type: String as PropType<VButtonColor>,
|
||||||
|
default: undefined,
|
||||||
|
validator: (value: VButtonColor) => {
|
||||||
|
// The value must match one of these strings
|
||||||
|
if (
|
||||||
|
[
|
||||||
|
undefined,
|
||||||
|
'primary',
|
||||||
|
'info',
|
||||||
|
'success',
|
||||||
|
'warning',
|
||||||
|
'danger',
|
||||||
|
'white',
|
||||||
|
'dark',
|
||||||
|
'light',
|
||||||
|
'validation',
|
||||||
|
].indexOf(value) === -1
|
||||||
|
) {
|
||||||
|
console.warn(
|
||||||
|
`VButton: invalid "${value}" color. Should be primary, info, success, warning, danger, dark, light, validation, white or undefined`,
|
||||||
|
)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
},
|
||||||
|
},
|
||||||
|
size: {
|
||||||
|
type: String as PropType<VButtonSize>,
|
||||||
|
default: undefined,
|
||||||
|
validator: (value: VButtonSize) => {
|
||||||
|
// The value must match one of these strings
|
||||||
|
if ([undefined, 'medium', 'big', 'huge'].indexOf(value) === -1) {
|
||||||
|
console.warn(
|
||||||
|
`VButton: invalid "${value}" size. Should be big, huge, medium or undefined`,
|
||||||
|
)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
},
|
||||||
|
},
|
||||||
|
dark: {
|
||||||
|
type: String as PropType<VButtonDark>,
|
||||||
|
default: undefined,
|
||||||
|
validator: (value: VButtonDark) => {
|
||||||
|
// The value must match one of these strings
|
||||||
|
if ([undefined, '1', '2', '3', '4', '5', '6'].indexOf(value) === -1) {
|
||||||
|
console.warn(
|
||||||
|
`VButton: invalid "${value}" dark. Should be 1, 2, 3, 4, 5, 6 or undefined`,
|
||||||
|
)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rounded: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
bold: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
fullwidth: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
light: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
raised: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
elevated: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
outlined: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
darkOutlined: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
loading: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
lower: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
static: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
slots: Object as SlotsType<{
|
||||||
|
default: void
|
||||||
|
}>,
|
||||||
|
setup(props, { slots, attrs }) {
|
||||||
|
const classes = computed(() => {
|
||||||
|
const defaultClasses = (attrs?.class || []) as string[] | string
|
||||||
|
return [
|
||||||
|
defaultClasses,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
const isIconify = computed(() => props.icon && props.icon.indexOf(':') !== -1)
|
||||||
|
const isCaretIconify = computed(
|
||||||
|
() => props.iconCaret && props.iconCaret.indexOf(':') !== -1,
|
||||||
|
)
|
||||||
|
|
||||||
|
const getChildrens = () => {
|
||||||
|
const childrens = []
|
||||||
|
|
||||||
|
let iconWrapper
|
||||||
|
if (isIconify.value) {
|
||||||
|
const icon = h('iconify-icon', {
|
||||||
|
class: 'iconify',
|
||||||
|
icon: props.icon,
|
||||||
|
})
|
||||||
|
iconWrapper = h('span', { class: 'icon' }, icon)
|
||||||
|
}
|
||||||
|
else if (props.icon) {
|
||||||
|
const icon = h('i', { 'aria-hidden': true, 'class': props.icon })
|
||||||
|
iconWrapper = h('span', { class: 'icon rtl-reflect' }, icon)
|
||||||
|
}
|
||||||
|
|
||||||
|
let caretWrapper
|
||||||
|
if (isCaretIconify.value) {
|
||||||
|
const caret = h('iconify-icon', {
|
||||||
|
class: 'iconify',
|
||||||
|
icon: props.iconCaret,
|
||||||
|
})
|
||||||
|
caretWrapper = h('span', { class: 'caret' }, caret)
|
||||||
|
}
|
||||||
|
else if (props.iconCaret) {
|
||||||
|
const caret = h('i', { 'aria-hidden': true, 'class': props.iconCaret })
|
||||||
|
caretWrapper = h('span', { class: 'caret' }, caret)
|
||||||
|
}
|
||||||
|
|
||||||
|
if (iconWrapper) {
|
||||||
|
childrens.push(iconWrapper)
|
||||||
|
}
|
||||||
|
if (props.placeload) {
|
||||||
|
childrens.push(
|
||||||
|
h(VPlaceload, {
|
||||||
|
width: props.placeload,
|
||||||
|
}),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
childrens.push(h('span', slots.default?.()))
|
||||||
|
}
|
||||||
|
if (caretWrapper) {
|
||||||
|
childrens.push(caretWrapper)
|
||||||
|
}
|
||||||
|
|
||||||
|
return childrens
|
||||||
|
}
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
if (props.to) {
|
||||||
|
return h(
|
||||||
|
RouterLink,
|
||||||
|
{
|
||||||
|
...attrs,
|
||||||
|
'aria-hidden': !!props.placeload,
|
||||||
|
'to': props.to,
|
||||||
|
'class': ['button', ...classes.value],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
default: getChildrens,
|
||||||
|
},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
else if (props.href) {
|
||||||
|
return h(
|
||||||
|
'a',
|
||||||
|
{
|
||||||
|
...attrs,
|
||||||
|
'aria-hidden': !!props.placeload,
|
||||||
|
'href': props.href,
|
||||||
|
'class': classes.value,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
default: getChildrens,
|
||||||
|
},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return h(
|
||||||
|
'button',
|
||||||
|
{
|
||||||
|
'type': 'button',
|
||||||
|
...attrs,
|
||||||
|
'aria-hidden': !!props.placeload,
|
||||||
|
'disabled': props.disabled,
|
||||||
|
'class': ['button', ...classes.value],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
default: getChildrens,
|
||||||
|
},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.button {
|
||||||
|
&.is-circle {
|
||||||
|
border-radius: var(--radius-rounded);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.v-button {
|
||||||
|
padding: 8px 22px;
|
||||||
|
height: 38px;
|
||||||
|
line-height: 1.1;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
font-family: var(--font);
|
||||||
|
transition: all 0.3s; // transition-all test
|
||||||
|
|
||||||
|
&:not([disabled]) {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active,
|
||||||
|
&:focus {
|
||||||
|
box-shadow: none !important;
|
||||||
|
border-color: color-mix(in oklab, var(--fade-grey), black 2%);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(
|
||||||
|
.is-primary,
|
||||||
|
.is-success,
|
||||||
|
.is-info,
|
||||||
|
.is-warning,
|
||||||
|
.is-danger,
|
||||||
|
.is-light,
|
||||||
|
.is-white,
|
||||||
|
.is-validation
|
||||||
|
) {
|
||||||
|
&.is-active {
|
||||||
|
background: var(--primary) !important;
|
||||||
|
border-color: var(--primary) !important;
|
||||||
|
color: var(--white) !important;
|
||||||
|
box-shadow: var(--primary-box-shadow) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus-visible {
|
||||||
|
outline-offset: var(--accessibility-focus-outline-offset);
|
||||||
|
outline-width: var(--accessibility-focus-outline-width);
|
||||||
|
outline-style: var(--accessibility-focus-outline-style);
|
||||||
|
outline-color: var(--accessibility-focus-outline-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-bold {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-primary {
|
||||||
|
&.is-raised:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
box-shadow: var(--primary-box-shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--primary-box-shadow);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-success {
|
||||||
|
&.is-raised:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
box-shadow: var(--success-box-shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--success-box-shadow);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-info {
|
||||||
|
&.is-raised:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
box-shadow: var(--info-box-shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--info-box-shadow);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-warning {
|
||||||
|
&.is-raised:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
box-shadow: var(--warning-box-shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--warning-box-shadow);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-validation {
|
||||||
|
&.is-raised:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
box-shadow: var(--warning-box-shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--warning-box-shadow);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-danger {
|
||||||
|
&.is-raised:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
box-shadow: var(--danger-box-shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--danger-box-shadow);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-lower {
|
||||||
|
text-transform: none !important;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-big {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-medium {
|
||||||
|
height: 2.5rem;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-huge {
|
||||||
|
height: 50px;
|
||||||
|
width: 220px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.simple-action {
|
||||||
|
height: 32px;
|
||||||
|
padding: 0 24px;
|
||||||
|
line-height: 0;
|
||||||
|
border-radius: 100px;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
font-weight: 500;
|
||||||
|
transition: all 0.3s; // transition-all test
|
||||||
|
|
||||||
|
&.is-purple {
|
||||||
|
background: var(--primary);
|
||||||
|
border-color: var(--primary);
|
||||||
|
color: var(--smoke-white);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
opacity: 0.95;
|
||||||
|
box-shadow: var(--primary-box-shadow);
|
||||||
|
color: var(--smoke-white) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.has-icon {
|
||||||
|
.iconify {
|
||||||
|
height: 16px;
|
||||||
|
width: 16px;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: var(--primary);
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconify {
|
||||||
|
height: 18px;
|
||||||
|
width: 18px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
.iconify {
|
||||||
|
height: 14px;
|
||||||
|
width: 14px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.is-dark {
|
||||||
|
.v-button {
|
||||||
|
&:not(
|
||||||
|
.is-primary,
|
||||||
|
.is-success,
|
||||||
|
.is-info,
|
||||||
|
.is-warning,
|
||||||
|
.is-danger,
|
||||||
|
.is-light,
|
||||||
|
.is-white,
|
||||||
|
.is-validation
|
||||||
|
) {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%);
|
||||||
|
border-color: color-mix(in oklab, var(--dark-sidebar), white 12%);
|
||||||
|
color: var(--dark-dark-text);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
border-color: color-mix(in oklab, var(--dark-sidebar), white 18%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-light {
|
||||||
|
border: none;
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: var(--smoke-white) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-primary {
|
||||||
|
border-color: var(--primary);
|
||||||
|
background: var(--primary);
|
||||||
|
|
||||||
|
&.is-raised:hover {
|
||||||
|
box-shadow: var(--primary-box-shadow) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-elevated {
|
||||||
|
box-shadow: var(--primary-box-shadow) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-outlined {
|
||||||
|
background: transparent;
|
||||||
|
border-color: var(--primary) !important;
|
||||||
|
color: var(--primary);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
background: var(--primary) !important;
|
||||||
|
border-color: var(--primary) !important;
|
||||||
|
color: var(--white) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-light {
|
||||||
|
border: none;
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: color-mix(in oklab, var(--primary), white 20%) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-info {
|
||||||
|
&.is-light {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: color-mix(in oklab, var(--info), white 20%) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-success {
|
||||||
|
&.is-light {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: color-mix(in oklab, var(--success), white 20%) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-warning {
|
||||||
|
&.is-light {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: color-mix(in oklab, var(--warning), white 20%) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-validation {
|
||||||
|
&.is-light {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: color-mix(in oklab, var(--warning), white 20%) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-danger {
|
||||||
|
&.is-light {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%) !important;
|
||||||
|
color: color-mix(in oklab, var(--danger), white 20%) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 16%) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-white {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 6%) !important;
|
||||||
|
border-color: var(--muted-grey) !important;
|
||||||
|
color: var(--muted-grey) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-dark-outlined {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%);
|
||||||
|
border-color: color-mix(in oklab, var(--dark-sidebar), white 12%);
|
||||||
|
color: var(--dark-dark-text);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
border-color: var(--primary) !important;
|
||||||
|
color: var(--primary) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
&:not(
|
||||||
|
.is-primary,
|
||||||
|
.is-success,
|
||||||
|
.is-info,
|
||||||
|
.is-warning,
|
||||||
|
.is-danger,
|
||||||
|
.is-light,
|
||||||
|
.is-white,
|
||||||
|
.is-validation
|
||||||
|
) {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%);
|
||||||
|
border-color: color-mix(in oklab, var(--dark-sidebar), white 12%);
|
||||||
|
color: var(--dark-dark-text);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
border-color: color-mix(in oklab, var(--dark-sidebar), white 18%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-primary {
|
||||||
|
border-color: var(--primary);
|
||||||
|
background: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-white {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 6%) !important;
|
||||||
|
border-color: var(--muted-grey) !important;
|
||||||
|
color: var(--muted-grey) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-dark-outlined {
|
||||||
|
background: color-mix(in oklab, var(--dark-sidebar), white 10%);
|
||||||
|
border-color: color-mix(in oklab, var(--dark-sidebar), white 12%);
|
||||||
|
color: var(--dark-dark-text);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
border-color: var(--primary) !important;
|
||||||
|
color: var(--primary) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -69,6 +69,7 @@ watch(() => props.cd_grp, async (newVal) => {
|
|||||||
@blur="field?.handleBlur"
|
@blur="field?.handleBlur"
|
||||||
>
|
>
|
||||||
<option value="null">{{ props.placeholder || '선택하세요' }}</option>
|
<option value="null">{{ props.placeholder || '선택하세요' }}</option>
|
||||||
|
<option value="">{{ props.placeholder || '선택하세요' }}</option>
|
||||||
<option
|
<option
|
||||||
v-for="item in cdItems"
|
v-for="item in cdItems"
|
||||||
:key="item.cd"
|
:key="item.cd"
|
||||||
|
|||||||
@@ -69,6 +69,23 @@ const onKeyup = async (e: any) => {
|
|||||||
const res = await getUserList({params:{name : e.target.value}})
|
const res = await getUserList({params:{name : e.target.value}})
|
||||||
|
|
||||||
if (res.length > 0) {
|
if (res.length > 0) {
|
||||||
|
res.forEach(u => {
|
||||||
|
if (model.value?.length > 0) {
|
||||||
|
const ignore = model.value.reduce((a: Person, b: Person) => {
|
||||||
|
return a.sabun + '|' + b.sabun
|
||||||
|
})
|
||||||
|
|
||||||
|
if (typeof ignore !== 'object') {
|
||||||
|
if (ignore.includes(u.sabun)) {
|
||||||
|
u['disabled'] = true
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (ignore.sabun.includes(u.sabun)) {
|
||||||
|
u['disabled'] = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
// res.forEach(u => { 2명으로 제한 로직 풀기 25.05.29
|
// res.forEach(u => { 2명으로 제한 로직 풀기 25.05.29
|
||||||
// if (model.value?.length > 0) {
|
// if (model.value?.length > 0) {
|
||||||
// const ignore = model.value.reduce((a: Person, b: Person) => {
|
// const ignore = model.value.reduce((a: Person, b: Person) => {
|
||||||
@@ -110,16 +127,16 @@ const onKeyup = async (e: any) => {
|
|||||||
</VLabel>
|
</VLabel>
|
||||||
<VControl icon="lucide:search">
|
<VControl icon="lucide:search">
|
||||||
<Multiselect
|
<Multiselect
|
||||||
v-model="approvers"
|
v-model="approvers"
|
||||||
:attrs="{ id }"
|
:attrs="{ id }"
|
||||||
:searchable="true"
|
:searchable="true"
|
||||||
:disabled="props.disabled"
|
:disabled="props.disabled"
|
||||||
:options="tagsOptions"
|
:options="tagsOptions"
|
||||||
mode="multiple"
|
mode="multiple"
|
||||||
noResultsText="조회된 결과가 없습니다."
|
noResultsText="조회된 결과가 없습니다."
|
||||||
noOptionsText="검색된 결과가 없습니다."
|
noOptionsText="검색된 결과가 없습니다."
|
||||||
:placeholder="props.placeholder"
|
:placeholder="props.placeholder"
|
||||||
@keyup="onKeyup"
|
@keyup="onKeyup"
|
||||||
>
|
>
|
||||||
<template #multiplelabel="{ values }">
|
<template #multiplelabel="{ values }">
|
||||||
<div class="multiselect-multiple-label pl-6">
|
<div class="multiselect-multiple-label pl-6">
|
||||||
@@ -139,4 +156,4 @@ const onKeyup = async (e: any) => {
|
|||||||
color: var(--modal-text) !important;
|
color: var(--modal-text) !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
130
src/components/app-vuero/VUserTemp.vue
Normal file
130
src/components/app-vuero/VUserTemp.vue
Normal file
@@ -0,0 +1,130 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { type Person } from '/@src/utils/types'
|
||||||
|
import { getUserList } from '/src/service/UserApi'
|
||||||
|
|
||||||
|
const model = defineModel<Person[]>()
|
||||||
|
const userSession = useUserSession()
|
||||||
|
const dataUser = reactive({
|
||||||
|
userSession: null,
|
||||||
|
})
|
||||||
|
|
||||||
|
// onBeforeMount(() => {
|
||||||
|
// dataUser.userSession = userSession.user.data
|
||||||
|
// const sessioinData = [{
|
||||||
|
// gubunCd: '0000', //구분
|
||||||
|
// gubunNm: '입안',
|
||||||
|
// deptNm: dataUser.userSession.dept.deptNm,
|
||||||
|
// sabun: dataUser.userSession.sabun,
|
||||||
|
// name: dataUser.userSession.name,
|
||||||
|
// attendCd: '', // 비고
|
||||||
|
//
|
||||||
|
// }]
|
||||||
|
// model.value = sessioinData
|
||||||
|
// })
|
||||||
|
const initiator = ref<Person | null>(null)
|
||||||
|
|
||||||
|
onBeforeMount(() => {
|
||||||
|
dataUser.userSession = userSession.user.data
|
||||||
|
initiator.value = {
|
||||||
|
gubunCd: '0000',
|
||||||
|
gubunNm: '입안',
|
||||||
|
deptNm: dataUser.userSession.dept.deptNm,
|
||||||
|
sabun: dataUser.userSession.sabun,
|
||||||
|
name: dataUser.userSession.name,
|
||||||
|
attendCd: '',
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
label: {
|
||||||
|
type: String,
|
||||||
|
default: '직원검색',
|
||||||
|
},
|
||||||
|
placeholder: {
|
||||||
|
type: String,
|
||||||
|
},
|
||||||
|
disabled: {
|
||||||
|
type: Boolean
|
||||||
|
},
|
||||||
|
modelValue: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
export interface VUserEmits {
|
||||||
|
(e: 'update:modelValue', value: any): void
|
||||||
|
}
|
||||||
|
const emits = defineEmits<VUserEmits>()
|
||||||
|
const tagsOptions = ref([])
|
||||||
|
|
||||||
|
const approvers = ref()
|
||||||
|
|
||||||
|
watch(() => props.modelValue, (newVal) => {
|
||||||
|
if (newVal.length > 0) {
|
||||||
|
emits('update:modelValue', approvers)
|
||||||
|
approvers.value = []
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const onKeyup = async (e: any) => {
|
||||||
|
const regex_jaeum = /[ㄱ-ㅎ]/g
|
||||||
|
if (e.key === 'Enter') {
|
||||||
|
if (e.target.value.match(regex_jaeum) === null) {
|
||||||
|
try {
|
||||||
|
const res = await getUserList({params:{name : e.target.value}})
|
||||||
|
|
||||||
|
if (res.length > 0) {
|
||||||
|
tagsOptions.value = res
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Error fetching user list:', e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (e.target.value === '') {
|
||||||
|
tagsOptions.value = []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<VField v-slot="{ id }" class="pr-2 is-autocomplete-select">
|
||||||
|
<VLabel class="has-fullwidth">
|
||||||
|
{{props.label}}
|
||||||
|
</VLabel>
|
||||||
|
<VControl icon="lucide:search">
|
||||||
|
<Multiselect
|
||||||
|
v-model="approvers"
|
||||||
|
:attrs="{ id }"
|
||||||
|
:searchable="true"
|
||||||
|
:disabled="props.disabled"
|
||||||
|
:options="tagsOptions"
|
||||||
|
mode="multiple"
|
||||||
|
noResultsText="조회된 결과가 없습니다."
|
||||||
|
noOptionsText="검색된 결과가 없습니다."
|
||||||
|
:placeholder="props.placeholder"
|
||||||
|
@keyup="onKeyup"
|
||||||
|
@update:modelValue="(val) => {
|
||||||
|
emits('update:modelValue', val)
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<template #multiplelabel="{ values }">
|
||||||
|
<div class="multiselect-multiple-label pl-6">
|
||||||
|
{{props.placeholder}}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</Multiselect>
|
||||||
|
</VControl>
|
||||||
|
</VField>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.field {
|
||||||
|
padding-bottom: 10px !important;
|
||||||
|
.label {
|
||||||
|
font-size: 1.3em;
|
||||||
|
color: var(--modal-text) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -41,8 +41,8 @@ const params = reactive({
|
|||||||
prcsNo: '', // 키값
|
prcsNo: '', // 키값
|
||||||
stCdFalg: false, // 버튼 컴포넌트화
|
stCdFalg: false, // 버튼 컴포넌트화
|
||||||
svyYn: false,
|
svyYn: false,
|
||||||
stCd:'',//결재상태 코드{ 등록중:0100[회수버튼],
|
stCd:'',//결재상태 코드{ 등록중:0100[회수버튼]
|
||||||
// 회수: 0300, 반려: 0400, 등록 완료: 0200 }
|
// 회수: 0300, 반려: 0400, 등록 완료: 0200[가격조사 완료], }
|
||||||
prcsAttsColumn:[ //첨부파일 입력
|
prcsAttsColumn:[ //첨부파일 입력
|
||||||
{ key: 'logiFnm', label: '구분'},
|
{ key: 'logiFnm', label: '구분'},
|
||||||
{ key: 'data', label: '데이터'}
|
{ key: 'data', label: '데이터'}
|
||||||
|
|||||||
@@ -14,7 +14,6 @@ onBeforeMount(async ()=>{
|
|||||||
|
|
||||||
const showTable = ref(false)
|
const showTable = ref(false)
|
||||||
const detailActionsOpen = ref(false)
|
const detailActionsOpen = ref(false)
|
||||||
const apprLine = defineModel<Person[]>()
|
|
||||||
|
|
||||||
const generalParams = reactive({
|
const generalParams = reactive({
|
||||||
title: "",
|
title: "",
|
||||||
@@ -30,6 +29,7 @@ const params = reactive({
|
|||||||
cateSelect: '',
|
cateSelect: '',
|
||||||
prcsNo: '',
|
prcsNo: '',
|
||||||
stCd: '', //상태코드 등록 전 : 0000
|
stCd: '', //상태코드 등록 전 : 0000
|
||||||
|
defaultPricePerson:[],
|
||||||
prcsAttsColumn:[ //첨부파일 입력
|
prcsAttsColumn:[ //첨부파일 입력
|
||||||
{ key: 'logiFnm', label: '구분'},
|
{ key: 'logiFnm', label: '구분'},
|
||||||
{ key: 'data', label: '데이터'}
|
{ key: 'data', label: '데이터'}
|
||||||
@@ -40,9 +40,10 @@ const params = reactive({
|
|||||||
{ key: 'deptNm', label: '부서' },
|
{ key: 'deptNm', label: '부서' },
|
||||||
{ key: 'sabun', label: '사번' },
|
{ key: 'sabun', label: '사번' },
|
||||||
{ key: 'name', label: '이름' },
|
{ key: 'name', label: '이름' },
|
||||||
{ key: 'attendCd', label: '비고'},
|
{ key: 'attendCd', label: '근태'},
|
||||||
{ key: 'apprStat', label: '결재상태'},
|
{ key: 'apprStat', label: '결재상태'},
|
||||||
{ key: 'apprDt', label: '승인일자'},
|
{ key: 'apprDt', label: '승인일자'},
|
||||||
|
{key:'actions', label: '동작'},
|
||||||
],
|
],
|
||||||
priceData:[],
|
priceData:[],
|
||||||
prcsBizsColumn: [ //견적사 입력
|
prcsBizsColumn: [ //견적사 입력
|
||||||
@@ -90,10 +91,9 @@ function getDetailList(arg){
|
|||||||
apprNo: req.apprNo,
|
apprNo: req.apprNo,
|
||||||
apprOrd: req.apprOrd,
|
apprOrd: req.apprOrd,
|
||||||
apprStat: req.apprStat,
|
apprStat: req.apprStat,
|
||||||
apprDt: req.apprDt,
|
apprDt: req.apprDt ? req.apprDt : '-',
|
||||||
attendCd: req.attendCd
|
attendCd: req.attendCd
|
||||||
})) //비고 데이터 없음, 승인일자 없음 todo
|
}))
|
||||||
console.log("apprLine.value",apprLine.value)
|
|
||||||
params.prcsAtts = arg.prcsAtts
|
params.prcsAtts = arg.prcsAtts
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -104,47 +104,83 @@ const changeButton = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const validation = () => {
|
const validation = () => {
|
||||||
notyf.dismissAll() //todo
|
notyf.dismissAll()
|
||||||
if(generalParams.regSdat > generalParams.regEdat){
|
if(generalParams.regSdat > generalParams.regEdat){
|
||||||
notyf.error("등록 종료일은 등록 시작일보다 빠를 수 없습니다.")
|
notyf.error("등록 종료일은 등록 시작일보다 빠를 수 없습니다.")
|
||||||
return
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
const resultGu = apprLine.value.filter((item)=> !item.gubunCd)
|
||||||
|
|
||||||
|
if(resultGu.length > 0){
|
||||||
|
notyf.error("결재선 구분값을 입력해주세요")
|
||||||
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if(apprLine.value.length < 2){
|
if(apprLine.value.length < 2){
|
||||||
notyf.error("결재선은 두 명이상 입력해주세요.")
|
notyf.error("결재선은 두 명이상 입력해주세요.")
|
||||||
return
|
return false
|
||||||
}
|
}
|
||||||
|
const result = apprLine.value.filter((item)=> item.gubunCd === '0200' )
|
||||||
|
|
||||||
|
if(result.length > 1){
|
||||||
|
notyf.error("결재는 한 명입니다.")
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
return true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const selectUser = ref<Person[]>([])
|
||||||
|
const apprLine = ref<Person[]>([])
|
||||||
|
|
||||||
|
const isDuplicate = (person: Person) =>
|
||||||
|
apprLine.value.some((p) => p.sabun === person.sabun)
|
||||||
|
|
||||||
|
watch(
|
||||||
|
selectUser,
|
||||||
|
(newPersons) => {
|
||||||
|
if (Array.isArray(newPersons) && newPersons.length > 0) {
|
||||||
|
const filtered = newPersons.filter((p) => !isDuplicate(p))
|
||||||
|
apprLine.value = [...apprLine.value, ...filtered]
|
||||||
|
selectUser.value = []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ deep: true }
|
||||||
|
)
|
||||||
|
|
||||||
const updatePriceOne = async () => {
|
const updatePriceOne = async () => {
|
||||||
let res = null
|
let res = null
|
||||||
try{
|
try{
|
||||||
loading.value = true
|
loading.value = true
|
||||||
validation()
|
if (validation()){
|
||||||
const paramsPrice ={
|
const paramsPrice ={
|
||||||
prcsNo : params.prcsNo,
|
prcsNo : params.prcsNo,
|
||||||
cateCd : params.cateSelect,
|
cateCd : params.cateSelect,
|
||||||
title: generalParams.title,
|
title: generalParams.title,
|
||||||
content: generalParams.content,
|
content: generalParams.content,
|
||||||
regSdat: formatDatefromString(generalParams.regSdat),
|
regSdat: formatDatefromString(generalParams.regSdat),
|
||||||
regEdat: formatDatefromString(generalParams.regEdat),
|
regEdat: formatDatefromString(generalParams.regEdat),
|
||||||
prvYn: false,
|
prvYn: false,
|
||||||
prvRsn : "",
|
prvRsn : "",
|
||||||
prvPwd : "",
|
prvPwd : "",
|
||||||
aiYn: false,
|
aiYn: false,
|
||||||
prcsBizs: params.prcsBizs.map(({ num, ...rest }) => rest), //견적사 입력 데이터
|
prcsBizs: params.prcsBizs.map(({ num, ...rest }) => rest), //견적사 입력 데이터
|
||||||
dtlSpecs: [], //todo
|
dtlSpecs: [], //todo
|
||||||
// params.dtlSpecs.map(({ num, ...rest }) => rest), //상세 규격 입력 데이터
|
// params.dtlSpecs.map(({ num, ...rest }) => rest), //상세 규격 입력 데이터
|
||||||
prcsAtts: pbAtts.value.map(req => ({
|
prcsAtts: pbAtts.value.map(req => ({
|
||||||
logiFnm: req.logiFnm,
|
logiFnm: req.logiFnm,
|
||||||
data: req.data})),//첨부파일 데이터,
|
data: req.data})),//첨부파일 데이터,
|
||||||
apprReqs: apprLine.value.map(({ deptNm, ...rest }) => rest), //결재선 데이터
|
apprReqs: apprLine.value.map(({ deptNm, ...rest }, index) => ({
|
||||||
}
|
...rest,
|
||||||
res = await updatePrice(paramsPrice)
|
apprOrd: index + 1, // 결재 순서 1부터 시작
|
||||||
notyf.dismissAll()
|
})), //결재선 데이터
|
||||||
if(res.request.status == '200'){
|
}
|
||||||
notyf.primary('수정 되었습니다.')
|
res = await updatePrice(paramsPrice)
|
||||||
router.push({path: '/app/priceManagement'})
|
notyf.dismissAll()
|
||||||
|
if(res.request.status == '200'){
|
||||||
|
notyf.primary('수정 되었습니다.')
|
||||||
|
router.push({path: '/app/priceManagement'})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}catch(e){
|
}catch(e){
|
||||||
notyf.error(e.message)
|
notyf.error(e.message)
|
||||||
@@ -191,6 +227,15 @@ const onDetailDelete = (index: number) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const onPriceDelete = (index: number) => {
|
||||||
|
|
||||||
|
if(apprLine.value.length-1 !== params.felxColumn.length
|
||||||
|
|| (params.felxColumn.length == 8 && apprLine.value.length-1 == params.felxColumn.length))
|
||||||
|
{
|
||||||
|
console.log("index",index)
|
||||||
|
apprLine.value.splice(index, 1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function onInput(row, column){
|
function onInput(row, column){
|
||||||
if (column.key === 'bizNo') {
|
if (column.key === 'bizNo') {
|
||||||
@@ -251,6 +296,20 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
|
|||||||
link.click()
|
link.click()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const moveUp = (index: number) => {
|
||||||
|
if (index <= 0) return
|
||||||
|
let temp = apprLine.value[index]
|
||||||
|
apprLine.value[index] = apprLine.value[index - 1]
|
||||||
|
apprLine.value[index - 1] = temp
|
||||||
|
}
|
||||||
|
|
||||||
|
const moveDown = (index: number) => {
|
||||||
|
if (index >= apprLine.value.length - 1) return
|
||||||
|
let temp = apprLine.value[index]
|
||||||
|
apprLine.value[index] = apprLine.value[index + 1]
|
||||||
|
apprLine.value[index + 1] = temp
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -539,7 +598,7 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-12">
|
<div class="column is-12">
|
||||||
<VUser v-model="apprLine"/>
|
<VUserTemp v-model="selectUser"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-12">
|
<div class="column is-12">
|
||||||
<VField class="pr-2">
|
<VField class="pr-2">
|
||||||
@@ -548,6 +607,7 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
|
|||||||
</VLabel>
|
</VLabel>
|
||||||
</VField>
|
</VField>
|
||||||
<ComVFlexTable
|
<ComVFlexTable
|
||||||
|
:key="apprLine.map(item => item.sabun).join(',')"
|
||||||
:data="apprLine"
|
:data="apprLine"
|
||||||
:columns="params.felxColumn"
|
:columns="params.felxColumn"
|
||||||
:separators="true"
|
:separators="true"
|
||||||
@@ -569,14 +629,15 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
|
|||||||
placeholder="재중"
|
placeholder="재중"
|
||||||
cd_grp=6
|
cd_grp=6
|
||||||
v-model="row.attendCd">
|
v-model="row.attendCd">
|
||||||
<!-- <template #code>-->
|
|
||||||
<!-- <span v-if="!row.attendCd">{{"재중"}}</span>-->
|
|
||||||
<!-- </template>-->
|
|
||||||
</VDefaultCodeSelect>
|
</VDefaultCodeSelect>
|
||||||
</VField>
|
</VField>
|
||||||
</span>
|
</span>
|
||||||
<span v-else
|
<span v-else-if="column.key === 'actions'" class="flex gap-1">
|
||||||
@click="onDetailDelete(index)">{{value}}</span>
|
<VCustomButton @click="moveUp(index)" icon="lucide:chevron-up" />
|
||||||
|
<VCustomButton @click="moveDown(index)" icon="lucide:chevron-down" />
|
||||||
|
<VCustomButton @click="onPriceDelete(index)" icon="lucide:x" />
|
||||||
|
</span>
|
||||||
|
<span v-else>{{value}}</span>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</ComVFlexTable>
|
</ComVFlexTable>
|
||||||
@@ -584,7 +645,7 @@ const onPrcsFileDownload = async (prcsNo: string, fileOrd: number, logiFnm: stri
|
|||||||
<div style="display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px;">
|
<div style="display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px;">
|
||||||
<VButton
|
<VButton
|
||||||
color="primary"
|
color="primary"
|
||||||
@click.stop="updatePriceOne"
|
@click.stop="updatePriceOne()"
|
||||||
raised>
|
raised>
|
||||||
수정
|
수정
|
||||||
</VButton>
|
</VButton>
|
||||||
|
|||||||
@@ -1,17 +1,27 @@
|
|||||||
import { acceptHMRUpdate, defineStore } from 'pinia'
|
import { acceptHMRUpdate, defineStore } from 'pinia'
|
||||||
import { useStorage } from '@vueuse/core'
|
|
||||||
import { getDetailCode } from '/@src/service/code'
|
import { getDetailCode } from '/@src/service/code'
|
||||||
|
|
||||||
export const useCodes = defineStore('codeStore', () => {
|
export const useCodes = defineStore('codeStore', () => {
|
||||||
// 🟡 상태
|
// 🟡 상태
|
||||||
const codes = ref<Record<number, Array<{ cd: string; nm: string }>>>({})
|
const codes = ref<Record<number, Array<{ cd: string; nm: string }>>>({})
|
||||||
|
|
||||||
// 🔵 액션: 코드 불러오기
|
const loadingPromises = new Map<number, Promise<void>>()
|
||||||
|
|
||||||
const setDetailCode = async (cd_grp: number) => {
|
const setDetailCode = async (cd_grp: number) => {
|
||||||
if (!codes.value[cd_grp]) {
|
if (codes.value[cd_grp] && codes.value[cd_grp].length > 0) return
|
||||||
const res = await getDetailCode(cd_grp)
|
|
||||||
codes.value[cd_grp] = res
|
if (loadingPromises.has(cd_grp)) {
|
||||||
|
return loadingPromises.get(cd_grp)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const p = getDetailCode(cd_grp).then((res) => {
|
||||||
|
codes.value[cd_grp] = res
|
||||||
|
}).finally(() => {
|
||||||
|
loadingPromises.delete(cd_grp)
|
||||||
|
})
|
||||||
|
|
||||||
|
loadingPromises.set(cd_grp, p)
|
||||||
|
return p
|
||||||
}
|
}
|
||||||
|
|
||||||
// 🟢 코드 목록 가져오기
|
// 🟢 코드 목록 가져오기
|
||||||
|
|||||||
3
types/components.d.ts
vendored
3
types/components.d.ts
vendored
@@ -483,6 +483,7 @@ declare module 'vue' {
|
|||||||
VCreditCard: typeof import('./../src/components/base-addons/VCreditCard.vue')['default']
|
VCreditCard: typeof import('./../src/components/base-addons/VCreditCard.vue')['default']
|
||||||
VCreditCardDocumentation: typeof import('./../documentation/plugins/credit-card/v-credit-card-documentation.md')['default']
|
VCreditCardDocumentation: typeof import('./../documentation/plugins/credit-card/v-credit-card-documentation.md')['default']
|
||||||
VCreditCardPropsDocumentation: typeof import('./../documentation/plugins/credit-card/v-credit-card-props-documentation.md')['default']
|
VCreditCardPropsDocumentation: typeof import('./../documentation/plugins/credit-card/v-credit-card-props-documentation.md')['default']
|
||||||
|
VCustomButton: typeof import('./../src/components/app-vuero/VCustomButton.vue')['default']
|
||||||
VDarkmodeSwitch: typeof import('./../src/components/base/VDarkmodeSwitch.vue')['default']
|
VDarkmodeSwitch: typeof import('./../src/components/base/VDarkmodeSwitch.vue')['default']
|
||||||
VDarkmodeToggle: typeof import('./../src/components/base/VDarkmodeToggle.vue')['default']
|
VDarkmodeToggle: typeof import('./../src/components/base/VDarkmodeToggle.vue')['default']
|
||||||
VDefaultCodeSelect: typeof import('./../src/components/app-vuero/VDefaultCodeSelect.vue')['default']
|
VDefaultCodeSelect: typeof import('./../src/components/app-vuero/VDefaultCodeSelect.vue')['default']
|
||||||
@@ -507,6 +508,7 @@ declare module 'vue' {
|
|||||||
VFlexTableBaseDocumentation: typeof import('./../documentation/flex-table/v-flex-table-base-documentation.md')['default']
|
VFlexTableBaseDocumentation: typeof import('./../documentation/flex-table/v-flex-table-base-documentation.md')['default']
|
||||||
VFlexTableCell: typeof import('./../src/components/base/VFlexTableCell.vue')['default']
|
VFlexTableCell: typeof import('./../src/components/base/VFlexTableCell.vue')['default']
|
||||||
VFlexTableColumnsDocumentation: typeof import('./../documentation/flex-table/v-flex-table-columns-documentation.md')['default']
|
VFlexTableColumnsDocumentation: typeof import('./../documentation/flex-table/v-flex-table-columns-documentation.md')['default']
|
||||||
|
VFlexTableCustomize: typeof import('./../src/components/app-vuero/VFlexTableCustomize.vue')['default']
|
||||||
VFlexTableMediaDocumentation: typeof import('./../documentation/flex-table/v-flex-table-media-documentation.md')['default']
|
VFlexTableMediaDocumentation: typeof import('./../documentation/flex-table/v-flex-table-media-documentation.md')['default']
|
||||||
VFlexTablePrintObjectsDocumentation: typeof import('./../documentation/flex-table/v-flex-table-print-objects-documentation.md')['default']
|
VFlexTablePrintObjectsDocumentation: typeof import('./../documentation/flex-table/v-flex-table-print-objects-documentation.md')['default']
|
||||||
VFlexTableScrollableDocumentation: typeof import('./../documentation/flex-table/v-flex-table-scrollable-documentation.md')['default']
|
VFlexTableScrollableDocumentation: typeof import('./../documentation/flex-table/v-flex-table-scrollable-documentation.md')['default']
|
||||||
@@ -603,6 +605,7 @@ declare module 'vue' {
|
|||||||
VTextarea: typeof import('./../src/components/base/VTextarea.vue')['default']
|
VTextarea: typeof import('./../src/components/base/VTextarea.vue')['default']
|
||||||
VTextEllipsis: typeof import('./../src/components/base/VTextEllipsis.vue')['default']
|
VTextEllipsis: typeof import('./../src/components/base/VTextEllipsis.vue')['default']
|
||||||
VUser: typeof import('./../src/components/app-vuero/VUser.vue')['default']
|
VUser: typeof import('./../src/components/app-vuero/VUser.vue')['default']
|
||||||
|
VUserTemp: typeof import('./../src/components/app-vuero/VUserTemp.vue')['default']
|
||||||
VVivus: typeof import('./../src/components/base-addons/VVivus.vue')['default']
|
VVivus: typeof import('./../src/components/base-addons/VVivus.vue')['default']
|
||||||
WebappConversation1: typeof import('./../src/components/partials/messaging/WebappConversation1.vue')['default']
|
WebappConversation1: typeof import('./../src/components/partials/messaging/WebappConversation1.vue')['default']
|
||||||
WebappConversation10: typeof import('./../src/components/partials/messaging/WebappConversation10.vue')['default']
|
WebappConversation10: typeof import('./../src/components/partials/messaging/WebappConversation10.vue')['default']
|
||||||
|
|||||||
Reference in New Issue
Block a user