Showing
5 changed files
with
1 additions
and
139 deletions
src/packages/components/external/Composes/Mores/Button/config.ts
deleted
100644 → 0
| 1 | -import { PublicConfigClass } from '@/packages/public' | ||
| 2 | -import { CreateComponentType } from '@/packages/index.d' | ||
| 3 | -import { ButtonConfig } from './index' | ||
| 4 | -import cloneDeep from 'lodash/cloneDeep' | ||
| 5 | - | ||
| 6 | -export const option = { | ||
| 7 | - dataset: '默认', | ||
| 8 | - /** | ||
| 9 | - * Naive UI button部分属性 | ||
| 10 | - */ | ||
| 11 | - attribute:{ | ||
| 12 | - //尺寸 | ||
| 13 | - size:'medium', | ||
| 14 | - //透明 | ||
| 15 | - ghost:false, | ||
| 16 | - //加载 | ||
| 17 | - loading:false, | ||
| 18 | - //自定义颜色 | ||
| 19 | - color:'#ffffff', | ||
| 20 | - //文字背景 | ||
| 21 | - textColor:'black' | ||
| 22 | - } | ||
| 23 | -} | ||
| 24 | - | ||
| 25 | -export default class Config extends PublicConfigClass implements CreateComponentType { | ||
| 26 | - public key = ButtonConfig.key | ||
| 27 | - public chartConfig = cloneDeep(ButtonConfig) | ||
| 28 | - public option = cloneDeep(option) | ||
| 29 | -} |
src/packages/components/external/Composes/Mores/Button/config.vue
deleted
100644 → 0
| 1 | -<template> | ||
| 2 | - <CollapseItem name="按钮配置" :expanded="true"> | ||
| 3 | - <SettingItemBox name="信息"> | ||
| 4 | - <SettingItem name="文字"> | ||
| 5 | - <n-input size="small" v-model:value="optionData.dataset"></n-input> | ||
| 6 | - </SettingItem> | ||
| 7 | - <SettingItem name="文字颜色"> | ||
| 8 | - <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.attribute.textColor"></n-color-picker> | ||
| 9 | - </SettingItem> | ||
| 10 | - <SettingItem> | ||
| 11 | - <n-button size="small" @click="optionData.attribute.textColor ='black'"> 恢复默认 </n-button> | ||
| 12 | - </SettingItem> | ||
| 13 | - </SettingItemBox> | ||
| 14 | - <SettingItemBox name="属性"> | ||
| 15 | - <SettingItem name="颜色"> | ||
| 16 | - <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.attribute.color"></n-color-picker> | ||
| 17 | - </SettingItem> | ||
| 18 | - <SettingItem> | ||
| 19 | - <n-button size="small" @click="optionData.attribute.color ='#ffffff'"> 恢复默认 </n-button> | ||
| 20 | - </SettingItem> | ||
| 21 | - <SettingItem name="是否透明"> | ||
| 22 | - <n-switch v-model:value="optionData.attribute.ghost" /> | ||
| 23 | - </SettingItem> | ||
| 24 | - <SettingItem name="是否加载"> | ||
| 25 | - <n-switch v-model:value="optionData.attribute.loading" /> | ||
| 26 | - </SettingItem> | ||
| 27 | - </SettingItemBox> | ||
| 28 | - </CollapseItem> | ||
| 29 | -</template> | ||
| 30 | - | ||
| 31 | -<script setup lang="ts"> | ||
| 32 | -import { PropType } from 'vue' | ||
| 33 | -import { option } from './config' | ||
| 34 | -import { CollapseItem, SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting' | ||
| 35 | - | ||
| 36 | -defineProps({ | ||
| 37 | - optionData: { | ||
| 38 | - type: Object as PropType<typeof option>, | ||
| 39 | - required: true | ||
| 40 | - } | ||
| 41 | -}) | ||
| 42 | -</script> |
src/packages/components/external/Composes/Mores/Button/index.ts
deleted
100644 → 0
| 1 | -import { ChartFrameEnum, ConfigType } from '@/packages/index.d' | ||
| 2 | -import { EPackagesCategoryEnum } from '@/packages/components/external/types' | ||
| 3 | -import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' | ||
| 4 | -import { useWidgetKey } from '@/packages/external/useWidgetKey' | ||
| 5 | - | ||
| 6 | -const { key, chartKey, conKey } = useWidgetKey('Button') | ||
| 7 | -export const ButtonConfig: ConfigType = { | ||
| 8 | - key, | ||
| 9 | - chartKey, | ||
| 10 | - conKey, | ||
| 11 | - title: '按钮', | ||
| 12 | - category: ChatCategoryEnum.MORE, | ||
| 13 | - categoryName: ChatCategoryEnumName.MORE, | ||
| 14 | - package: EPackagesCategoryEnum.COMPOSES, | ||
| 15 | - chartFrame: ChartFrameEnum.NAIVE_UI, | ||
| 16 | - image: 'button.png', | ||
| 17 | -} |
src/packages/components/external/Composes/Mores/Button/index.vue
deleted
100644 → 0
| 1 | -<template> | ||
| 2 | - <div class="go-content-box"> | ||
| 3 | - <n-button class="content" @click="handleClick" v-bind={...attribute}>{{dataset}}</n-button> | ||
| 4 | - </div> | ||
| 5 | -</template> | ||
| 6 | -<script setup lang="ts"> | ||
| 7 | -import { PropType, toRefs } from 'vue' | ||
| 8 | -import { CreateComponentType } from '@/packages/index.d' | ||
| 9 | -import {option as configOption} from './config' | ||
| 10 | - | ||
| 11 | - | ||
| 12 | -const props = defineProps({ | ||
| 13 | - chartConfig: { | ||
| 14 | - type: Object as PropType<CreateComponentType>, | ||
| 15 | - required: true | ||
| 16 | - } | ||
| 17 | -}) | ||
| 18 | - | ||
| 19 | -//修改默认宽高距离位置 | ||
| 20 | -props.chartConfig.attr.w = 100 | ||
| 21 | -props.chartConfig.attr.h = 50 | ||
| 22 | -props.chartConfig.attr.x = 200 | ||
| 23 | -props.chartConfig.attr.y = 200 | ||
| 24 | - | ||
| 25 | -const { dataset,attribute }= toRefs(props.chartConfig.option) as unknown as typeof configOption | ||
| 26 | - | ||
| 27 | -const { w, h } = toRefs(props.chartConfig.attr) | ||
| 28 | - | ||
| 29 | -const handleClick=()=>{ | ||
| 30 | - attribute.loading=true | ||
| 31 | - window['$message'].success('您点击了按钮') | ||
| 32 | - attribute.loading=false | ||
| 33 | -} | ||
| 34 | - | ||
| 35 | - | ||
| 36 | - | ||
| 37 | -</script> | ||
| 38 | - | ||
| 39 | -<style lang="scss" scoped> | ||
| 40 | -.go-content-box{ | ||
| 41 | - display: flex; | ||
| 42 | - align-items: center; | ||
| 43 | - justify-content: center; | ||
| 44 | - .content{ | ||
| 45 | - width:v-bind('w + "px"'); | ||
| 46 | - height:v-bind('h + "px"'); | ||
| 47 | - } | ||
| 48 | -} | ||
| 49 | -</style> |
| 1 | import { Title1Config } from './Title1/index' | 1 | import { Title1Config } from './Title1/index' |
| 2 | import { Title2Config } from './Title2/index' | 2 | import { Title2Config } from './Title2/index' |
| 3 | import { Title3Config } from './Title3/index' | 3 | import { Title3Config } from './Title3/index' |
| 4 | -import { ButtonConfig } from './Button/index' | ||
| 5 | import { CameraConfig } from './Camera/index' | 4 | import { CameraConfig } from './Camera/index' |
| 6 | 5 | ||
| 7 | -export default [Title1Config, Title2Config, Title3Config, CameraConfig, ButtonConfig] | 6 | +export default [Title1Config, Title2Config, Title3Config, CameraConfig] |