mirror of
https://gitee.com/dromara/go-view.git
synced 2026-07-10 01:51:05 +08:00
Compare commits
3 Commits
91170cfdfe
...
4d075cff2f
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
4d075cff2f | ||
|
|
6d5688693b | ||
|
|
8d9041964c |
@ -12,7 +12,7 @@ export const option = {
|
||||
|
||||
export default class Config extends PublicConfigClass implements CreateComponentType {
|
||||
public key = FullScreenConfig.key
|
||||
public attr = { ...chartInitConfig, w: 150, h: 150 }
|
||||
public attr = { ...chartInitConfig, w: 150, h: 150, zIndex: -1 }
|
||||
public chartConfig = cloneDeep(FullScreenConfig)
|
||||
public option = cloneDeep(option)
|
||||
}
|
||||
|
||||
@ -30,40 +30,40 @@ const isFullscreen = ref(false)
|
||||
const checkFullscreen = () => {
|
||||
isFullscreen.value = !!(
|
||||
document.fullscreenElement ||
|
||||
document.webkitFullscreenElement ||
|
||||
document.mozFullScreenElement ||
|
||||
document.msFullscreenElement
|
||||
(document as any).webkitFullscreenElement ||
|
||||
(document as any).mozFullScreenElement ||
|
||||
(document as any).msFullscreenElement
|
||||
)
|
||||
}
|
||||
checkFullscreen()
|
||||
|
||||
const requestFullscreen = element => {
|
||||
const requestFullscreen = (element: Element) => {
|
||||
if (element.requestFullscreen) {
|
||||
element.requestFullscreen()
|
||||
} else if (element.mozRequestFullScreen) {
|
||||
} else if ((document as any).mozRequestFullScreen) {
|
||||
/* Firefox */
|
||||
element.mozRequestFullScreen()
|
||||
} else if (element.webkitRequestFullscreen) {
|
||||
(document as any).mozRequestFullScreen()
|
||||
} else if ((document as any).webkitRequestFullscreen) {
|
||||
/* Chrome, Safari and Opera */
|
||||
element.webkitRequestFullscreen()
|
||||
} else if (element.msRequestFullscreen) {
|
||||
(document as any).webkitRequestFullscreen()
|
||||
} else if ((document as any).msRequestFullscreen) {
|
||||
/* IE/Edge */
|
||||
element.msRequestFullscreen()
|
||||
(document as any).msRequestFullscreen()
|
||||
}
|
||||
}
|
||||
|
||||
const exitFullscreen = () => {
|
||||
if (document.fullscreenElement && document.exitFullscreen) {
|
||||
document.exitFullscreen()
|
||||
} else if (document.mozFullScreenElement && document.mozCancelFullScreen) {
|
||||
} else if ((document as any).mozFullScreenElement && (document as any).mozCancelFullScreen) {
|
||||
/* Firefox */
|
||||
document.mozCancelFullScreen()
|
||||
} else if (document.webkitFullscreenElement && document.webkitExitFullscreen) {
|
||||
(document as any).mozCancelFullScreen()
|
||||
} else if ((document as any).webkitFullscreenElement && (document as any).webkitExitFullscreen) {
|
||||
/* Chrome, Safari and Opera */
|
||||
document.webkitExitFullscreen()
|
||||
} else if (document.msFullscreenElement && document.msExitFullscreen) {
|
||||
(document as any).webkitExitFullscreen()
|
||||
} else if ((document as any).msFullscreenElement && (document as any).msExitFullscreen) {
|
||||
/* IE/Edge */
|
||||
document.msExitFullscreen()
|
||||
(document as any).msExitFullscreen()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -0,0 +1,24 @@
|
||||
import cloneDeep from 'lodash/cloneDeep'
|
||||
import { PublicConfigClass } from '@/packages/public'
|
||||
import { CreateComponentType } from '@/packages/index.d'
|
||||
import { chartInitConfig } from '@/settings/designSetting'
|
||||
import { COMPONENT_INTERACT_EVENT_KET } from '@/enums/eventEnum'
|
||||
import { interactActions, ComponentInteractEventEnum } from './interact'
|
||||
import {InputsInputConfig} from "./index";
|
||||
|
||||
export const option = {
|
||||
// 时间组件展示类型,必须和 interactActions 中定义的数据一致
|
||||
[COMPONENT_INTERACT_EVENT_KET]: ComponentInteractEventEnum.DATA,
|
||||
// 默认值
|
||||
inputValue: "0",
|
||||
// 暴露配置内容给用户
|
||||
dataset: ""
|
||||
}
|
||||
|
||||
export default class Config extends PublicConfigClass implements CreateComponentType {
|
||||
public key = InputsInputConfig.key
|
||||
public attr = { ...chartInitConfig, w: 260, h: 32, zIndex: -1 }
|
||||
public chartConfig = cloneDeep(InputsInputConfig)
|
||||
public interactActions = interactActions
|
||||
public option = cloneDeep(option)
|
||||
}
|
||||
@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<collapse-item name="输入框配置" :expanded="true">
|
||||
<setting-item-box name="默认值" :alone="true">
|
||||
<n-input v-model:value="optionData.dataset" placeholder="若未输入,则默认值为0"/>
|
||||
</setting-item-box>
|
||||
</collapse-item>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { PropType } from 'vue'
|
||||
import { CollapseItem, SettingItemBox } from '@/components/Pages/ChartItemSetting'
|
||||
import { option } from './config'
|
||||
defineProps({
|
||||
optionData: {
|
||||
type: Object as PropType<typeof option>,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
</script>
|
||||
@ -0,0 +1,14 @@
|
||||
import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
|
||||
import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'
|
||||
|
||||
export const InputsInputConfig: ConfigType = {
|
||||
key: 'InputsInput',
|
||||
chartKey: 'VInputsInput',
|
||||
conKey: 'VCInputsInput',
|
||||
title: '输入框',
|
||||
category: ChatCategoryEnum.INPUTS,
|
||||
categoryName: ChatCategoryEnumName.INPUTS,
|
||||
package: PackagesCategoryEnum.INFORMATIONS,
|
||||
chartFrame: ChartFrameEnum.STATIC,
|
||||
image: 'inputs_select.png'
|
||||
}
|
||||
@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<div>
|
||||
<n-input :style="`width:${w}px;`" type="text"
|
||||
v-model:value="option.value.dataset"
|
||||
placeholder="请输入"
|
||||
@change="onChange">
|
||||
|
||||
</n-input>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { PropType, toRefs, shallowReactive, watch } from 'vue'
|
||||
import { CreateComponentType } from '@/packages/index.d'
|
||||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
|
||||
import { useChartInteract } from '@/hooks'
|
||||
import { InteractEventOn } from '@/enums/eventEnum'
|
||||
import { ComponentInteractParamsEnum } from './interact'
|
||||
|
||||
const props = defineProps({
|
||||
chartConfig: {
|
||||
type: Object as PropType<CreateComponentType>,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const { w, h } = toRefs(props.chartConfig.attr)
|
||||
const option = shallowReactive({
|
||||
value: {
|
||||
inputValue: props.chartConfig.option.inputValue,
|
||||
dataset: props.chartConfig.option.dataset
|
||||
}
|
||||
})
|
||||
|
||||
const onChange = (v: string) => {
|
||||
if(v == undefined) return;
|
||||
// 存储到联动数据
|
||||
useChartInteract(
|
||||
props.chartConfig,
|
||||
useChartEditStore,
|
||||
{ [ComponentInteractParamsEnum.DATA]: v },
|
||||
InteractEventOn.CHANGE
|
||||
)
|
||||
}
|
||||
|
||||
// 手动更新
|
||||
watch(
|
||||
() => props.chartConfig.option,
|
||||
(newData: any) => {
|
||||
option.value = newData
|
||||
onChange(newData.inputValue)
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
)
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,27 @@
|
||||
import { InteractEventOn, InteractActionsType } from '@/enums/eventEnum'
|
||||
|
||||
// 时间组件类型
|
||||
export enum ComponentInteractEventEnum {
|
||||
DATA = 'data'
|
||||
}
|
||||
|
||||
// 联动参数
|
||||
export enum ComponentInteractParamsEnum {
|
||||
DATA = 'data'
|
||||
}
|
||||
|
||||
// 定义组件触发回调事件
|
||||
export const interactActions: InteractActionsType[] = [
|
||||
{
|
||||
interactType: InteractEventOn.CHANGE,
|
||||
interactName: '选择完成',
|
||||
componentEmitEvents: {
|
||||
[ComponentInteractEventEnum.DATA]: [
|
||||
{
|
||||
value: ComponentInteractParamsEnum.DATA,
|
||||
label: '选择项'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
@ -2,5 +2,6 @@ import { InputsDateConfig } from './InputsDate/index'
|
||||
import { InputsSelectConfig } from './InputsSelect/index'
|
||||
import { InputsTabConfig } from './InputsTab/index'
|
||||
import { InputsPaginationConfig } from "./InputsPagination/index";
|
||||
import { InputsInputConfig} from "./InputsInput/index";
|
||||
|
||||
export default [InputsDateConfig, InputsSelectConfig, InputsTabConfig,InputsPaginationConfig]
|
||||
export default [InputsDateConfig, InputsSelectConfig, InputsTabConfig,InputsPaginationConfig,InputsInputConfig]
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user