diff --git a/src/assets/images/chart/units/leftchartsbg.png b/src/assets/images/chart/units/leftchartsbg.png new file mode 100644 index 0000000..d3e273e Binary files /dev/null and b/src/assets/images/chart/units/leftchartsbg.png differ diff --git a/src/assets/images/chart/units/searchBtn.png b/src/assets/images/chart/units/searchBtn.png new file mode 100644 index 0000000..5d67b85 Binary files /dev/null and b/src/assets/images/chart/units/searchBtn.png differ diff --git a/src/assets/images/chart/units/texttitle02bg.png b/src/assets/images/chart/units/texttitle02bg.png index 187e02e..5525d90 100644 Binary files a/src/assets/images/chart/units/texttitle02bg.png and b/src/assets/images/chart/units/texttitle02bg.png differ diff --git a/src/assets/images/chart/units/texttitle03bg.png b/src/assets/images/chart/units/texttitle03bg.png new file mode 100644 index 0000000..b669f53 Binary files /dev/null and b/src/assets/images/chart/units/texttitle03bg.png differ diff --git a/src/assets/images/chart/units/texttitle04bg.png b/src/assets/images/chart/units/texttitle04bg.png new file mode 100644 index 0000000..a6459d7 Binary files /dev/null and b/src/assets/images/chart/units/texttitle04bg.png differ diff --git a/src/assets/images/chart/units/texttitle05bg.png b/src/assets/images/chart/units/texttitle05bg.png new file mode 100644 index 0000000..e97f977 Binary files /dev/null and b/src/assets/images/chart/units/texttitle05bg.png differ diff --git a/src/assets/images/chart/zhigan/LowerLeft.png b/src/assets/images/chart/zhigan/LowerLeft.png new file mode 100644 index 0000000..2925076 Binary files /dev/null and b/src/assets/images/chart/zhigan/LowerLeft.png differ diff --git a/src/assets/images/chart/zhigan/ModalCarousel.png b/src/assets/images/chart/zhigan/ModalCarousel.png new file mode 100644 index 0000000..aaf7042 Binary files /dev/null and b/src/assets/images/chart/zhigan/ModalCarousel.png differ diff --git a/src/assets/images/chart/zhigan/ModalInfo.png b/src/assets/images/chart/zhigan/ModalInfo.png new file mode 100644 index 0000000..81ff84d Binary files /dev/null and b/src/assets/images/chart/zhigan/ModalInfo.png differ diff --git a/src/assets/images/chart/zhigan/ModalVideo.png b/src/assets/images/chart/zhigan/ModalVideo.png new file mode 100644 index 0000000..2976b79 Binary files /dev/null and b/src/assets/images/chart/zhigan/ModalVideo.png differ diff --git a/src/assets/images/chart/zhigan/component/lowerLeft.svg b/src/assets/images/chart/zhigan/component/lowerLeft.svg new file mode 100644 index 0000000..1da85fa --- /dev/null +++ b/src/assets/images/chart/zhigan/component/lowerLeft.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/packages/components/Decorates/Titles/Titles01/config.ts b/src/packages/components/Decorates/Titles/Titles01/config.ts index d586832..38a6c16 100644 --- a/src/packages/components/Decorates/Titles/Titles01/config.ts +++ b/src/packages/components/Decorates/Titles/Titles01/config.ts @@ -10,7 +10,7 @@ export const option = { borderTitleHeight: 98, borderTitleSize: 18, borderTitleColor: '#fff', - colors: ['#608561', '#374536'], + colors: ['#608561','#EEEEEE','#EAEAEA','#DCDCDC','#D8D8D8','#374536','#98B394','#DCFFD9','#687B66','#A1E6AC','#3D6644','#122115','#6C8069','#4E5C4C','#FFE6B3'], backgroundColor: '#00000000' } diff --git a/src/packages/components/Decorates/Titles/Titles01/index.vue b/src/packages/components/Decorates/Titles/Titles01/index.vue index 4ad6dd5..81da8b3 100644 --- a/src/packages/components/Decorates/Titles/Titles01/index.vue +++ b/src/packages/components/Decorates/Titles/Titles01/index.vue @@ -5,39 +5,39 @@ 大标题@2x - - - + + + - - - - + + + + - - + + - - - + + + - - + + - - + + - - - + + + @@ -54,9 +54,9 @@ - - - + + + @@ -110,34 +110,34 @@ - + - - + + - - - + + + - - + + - + - + @@ -146,11 +146,11 @@ - + - + diff --git a/src/packages/components/Icons/Default/Icon/index.vue b/src/packages/components/Icons/Default/Icon/index.vue index 5f091ca..2e586c5 100644 --- a/src/packages/components/Icons/Default/Icon/index.vue +++ b/src/packages/components/Icons/Default/Icon/index.vue @@ -7,14 +7,15 @@ :rotate="rotate" @click="clickBtn" @dblclick="dblclickBtn" - @rightclick="rightclickBtn" @contextmenu="rightclickBtn" + @mouseenter="mouseenterBtn" + @mouseleave="mouseleaveBtn" /> diff --git a/src/packages/components/Units/Titles/ContentTitle04/config.ts b/src/packages/components/Units/Titles/ContentTitle04/config.ts new file mode 100644 index 0000000..2768b1c --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle04/config.ts @@ -0,0 +1,17 @@ +import { PublicConfigClass } from '@/packages/public' +import { chartInitConfig } from '@/settings/designSetting' +import { CreateComponentType } from '@/packages/index.d' +import { ContentTitle04Config } from './index' +import cloneDeep from 'lodash/cloneDeep' + +export const option = { + boxId: 'linearGradientContentTitle04', + colors: ['#067847','#0EB07D','#FFB111','#FFB217','#457453','#0CB170'], +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = ContentTitle04Config.key + public attr = { ...chartInitConfig, w: 176, h: 60, zIndex: 1 } + public chartConfig = cloneDeep(ContentTitle04Config) + public option = cloneDeep(option) +} diff --git a/src/packages/components/Units/Titles/ContentTitle04/config.vue b/src/packages/components/Units/Titles/ContentTitle04/config.vue new file mode 100644 index 0000000..c5f2d98 --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle04/config.vue @@ -0,0 +1,53 @@ + + + diff --git a/src/packages/components/Units/Titles/ContentTitle04/index.ts b/src/packages/components/Units/Titles/ContentTitle04/index.ts new file mode 100644 index 0000000..f9aaf3c --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle04/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'; +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'; + +export const ContentTitle04Config: ConfigType = { + key: 'ContentTitle04', + chartKey: 'VContentTitle04', + conKey: 'VCContentTitle04', + title: '模块标题-04', + category: ChatCategoryEnum.TITLE, + categoryName: ChatCategoryEnumName.TITLE, + package: PackagesCategoryEnum.UNITS, + chartFrame: ChartFrameEnum.STATIC, + image: 'texttitle04bg.png', +}; diff --git a/src/packages/components/Units/Titles/ContentTitle04/index.vue b/src/packages/components/Units/Titles/ContentTitle04/index.vue new file mode 100644 index 0000000..83f618b --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle04/index.vue @@ -0,0 +1,83 @@ + + + + + diff --git a/src/packages/components/Units/Titles/ContentTitle05/config.ts b/src/packages/components/Units/Titles/ContentTitle05/config.ts new file mode 100644 index 0000000..9617d86 --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle05/config.ts @@ -0,0 +1,17 @@ +import { PublicConfigClass } from '@/packages/public' +import { chartInitConfig } from '@/settings/designSetting' +import { CreateComponentType } from '@/packages/index.d' +import { ContentTitle05Config } from './index' +import cloneDeep from 'lodash/cloneDeep' + +export const option = { + boxId: 'linearGradientContentTitle05', + colors: ['#583700','#FF9538','#E3AC5C','#C2742F','#F5A500','#0CB170'], +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = ContentTitle05Config.key + public attr = { ...chartInitConfig, w: 81, h: 23, zIndex: 1 } + public chartConfig = cloneDeep(ContentTitle05Config) + public option = cloneDeep(option) +} diff --git a/src/packages/components/Units/Titles/ContentTitle05/config.vue b/src/packages/components/Units/Titles/ContentTitle05/config.vue new file mode 100644 index 0000000..c5f2d98 --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle05/config.vue @@ -0,0 +1,53 @@ + + + diff --git a/src/packages/components/Units/Titles/ContentTitle05/index.ts b/src/packages/components/Units/Titles/ContentTitle05/index.ts new file mode 100644 index 0000000..a0fabe6 --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle05/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'; +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'; + +export const ContentTitle05Config: ConfigType = { + key: 'ContentTitle05', + chartKey: 'VContentTitle05', + conKey: 'VCContentTitle05', + title: '模块标题-05', + category: ChatCategoryEnum.TITLE, + categoryName: ChatCategoryEnumName.TITLE, + package: PackagesCategoryEnum.UNITS, + chartFrame: ChartFrameEnum.STATIC, + image: 'texttitle05bg.png', +}; diff --git a/src/packages/components/Units/Titles/ContentTitle05/index.vue b/src/packages/components/Units/Titles/ContentTitle05/index.vue new file mode 100644 index 0000000..b04117d --- /dev/null +++ b/src/packages/components/Units/Titles/ContentTitle05/index.vue @@ -0,0 +1,105 @@ + + + + + diff --git a/src/packages/components/Units/Titles/LeftCharts/config.ts b/src/packages/components/Units/Titles/LeftCharts/config.ts new file mode 100644 index 0000000..5bd9423 --- /dev/null +++ b/src/packages/components/Units/Titles/LeftCharts/config.ts @@ -0,0 +1,65 @@ +import { echartOptionProfixHandle, PublicConfigClass } from '@/packages/public' +import { LeftChartsConfig } from './index' +import { CreateComponentType } from '@/packages/index.d' +import { graphic } from 'echarts/core' +import { defaultTheme, chartColorsSearch } from '@/settings/chartThemes/index' +import cloneDeep from 'lodash/cloneDeep' +import dataJson from './data.json' + +export const includes = ['xAxis', 'yAxis', 'grid'] + +const option = { + tooltip: { + show: true, + trigger: 'axis', + axisPointer: { + type: 'line' + } + }, + xAxis: { + show: true, + type: 'category' + }, + yAxis: { + show: true, + type: 'value' + }, + dataset: { ...dataJson }, + series: [ + { + type: 'line', + smooth: true, + symbolSize: 10, //设定实心点的大小 + label: { + show: true, + position: 'top', + color: '#fff', + fontSize: 12 + }, + lineStyle: { + width: 3, + type: 'solid' + }, + areaStyle: { + opacity: 0.8, + color: new graphic.LinearGradient(0, 0, 0, 1, [ + { + offset: 0, + color: chartColorsSearch[defaultTheme][3] + }, + { + offset: 1, + color: 'rgba(0,0,0,0)' + } + ]) + } + } + ] +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key: string = LeftChartsConfig.key + public chartConfig = cloneDeep(LeftChartsConfig) + // 图表配置项 + public option = echartOptionProfixHandle(option, includes) +} diff --git a/src/packages/components/Units/Titles/LeftCharts/config.vue b/src/packages/components/Units/Titles/LeftCharts/config.vue new file mode 100644 index 0000000..3b33266 --- /dev/null +++ b/src/packages/components/Units/Titles/LeftCharts/config.vue @@ -0,0 +1,95 @@ + + + diff --git a/src/packages/components/Units/Titles/LeftCharts/data.json b/src/packages/components/Units/Titles/LeftCharts/data.json new file mode 100644 index 0000000..a28d4ee --- /dev/null +++ b/src/packages/components/Units/Titles/LeftCharts/data.json @@ -0,0 +1,40 @@ +{ + "dimensions": ["product", "data1", "data2"], + "source": [ + { + "product": "Mon", + "data1": 120, + "data2": 130 + }, + { + "product": "Tue", + "data1": 200, + "data2": 130 + }, + { + "product": "Wed", + "data1": 150, + "data2": 312 + }, + { + "product": "Thu", + "data1": 80, + "data2": 268 + }, + { + "product": "Fri", + "data1": 70, + "data2": 155 + }, + { + "product": "Sat", + "data1": 110, + "data2": 117 + }, + { + "product": "Sun", + "data1": 130, + "data2": 160 + } + ] +} diff --git a/src/packages/components/Units/Titles/LeftCharts/index.ts b/src/packages/components/Units/Titles/LeftCharts/index.ts new file mode 100644 index 0000000..2dff90c --- /dev/null +++ b/src/packages/components/Units/Titles/LeftCharts/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' + +export const LeftChartsConfig: ConfigType = { + key: 'LeftCharts', + chartKey: 'VLeftCharts', + conKey: 'VCLeftCharts', + title: '单折线渐变图', + category: ChatCategoryEnum.TITLE, + categoryName: ChatCategoryEnumName.TITLE, + package: PackagesCategoryEnum.UNITS, + chartFrame: ChartFrameEnum.STATIC, + image: 'leftchartsbg.png' +} diff --git a/src/packages/components/Units/Titles/LeftCharts/index.vue b/src/packages/components/Units/Titles/LeftCharts/index.vue new file mode 100644 index 0000000..ea67334 --- /dev/null +++ b/src/packages/components/Units/Titles/LeftCharts/index.vue @@ -0,0 +1,86 @@ + + + diff --git a/src/packages/components/Units/Titles/SearchBox/config.ts b/src/packages/components/Units/Titles/SearchBox/config.ts new file mode 100644 index 0000000..8b6b165 --- /dev/null +++ b/src/packages/components/Units/Titles/SearchBox/config.ts @@ -0,0 +1,17 @@ +import { PublicConfigClass } from '@/packages/public' +import { chartInitConfig } from '@/settings/designSetting' +import { CreateComponentType } from '@/packages/index.d' +import { SearchBoxConfig } from './index' +import cloneDeep from 'lodash/cloneDeep' + +export const option = { + boxId: 'linearGradientSearchBox', + colors: ['#00AF4A','#00751E','#344534','#647B64','#04691A','#0EF840','#07261E','#4A5C4A','#FFE4AC','#84DC9B'], +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = SearchBoxConfig.key + public attr = { ...chartInitConfig, w: 205, h: 53, zIndex: 1 } + public chartConfig = cloneDeep(SearchBoxConfig) + public option = cloneDeep(option) +} diff --git a/src/packages/components/Units/Titles/SearchBox/config.vue b/src/packages/components/Units/Titles/SearchBox/config.vue new file mode 100644 index 0000000..c5f2d98 --- /dev/null +++ b/src/packages/components/Units/Titles/SearchBox/config.vue @@ -0,0 +1,53 @@ + + + diff --git a/src/packages/components/Units/Titles/SearchBox/index.ts b/src/packages/components/Units/Titles/SearchBox/index.ts new file mode 100644 index 0000000..4d154f4 --- /dev/null +++ b/src/packages/components/Units/Titles/SearchBox/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'; +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'; + +export const SearchBoxConfig: ConfigType = { + key: 'SearchBox', + chartKey: 'VSearchBox', + conKey: 'VCSearchBox', + title: '全局搜索', + category: ChatCategoryEnum.TITLE, + categoryName: ChatCategoryEnumName.TITLE, + package: PackagesCategoryEnum.UNITS, + chartFrame: ChartFrameEnum.STATIC, + image: 'searchBtn.png', +}; diff --git a/src/packages/components/Units/Titles/SearchBox/index.vue b/src/packages/components/Units/Titles/SearchBox/index.vue new file mode 100644 index 0000000..6908120 --- /dev/null +++ b/src/packages/components/Units/Titles/SearchBox/index.vue @@ -0,0 +1,110 @@ + + + + + diff --git a/src/packages/components/Units/Titles/index.ts b/src/packages/components/Units/Titles/index.ts index e727ef4..093422d 100644 --- a/src/packages/components/Units/Titles/index.ts +++ b/src/packages/components/Units/Titles/index.ts @@ -5,7 +5,12 @@ import { TitlesBtnActiveConfig } from './TitlesBtnActive/index'; import { ContentBackgroundConfig } from './ContentBackground/index'; import { ContentTitleConfig } from './ContentTitle/index'; import { ContentTitle01Config } from './ContentTitle01/index'; -// import { ContentTitle02Config } from './ContentTitle02/index'; +import { ContentTitle02Config } from './ContentTitle02/index'; +import { ContentTitle03Config } from './ContentTitle03/index'; +import { ContentTitle04Config } from './ContentTitle04/index'; +import { ContentTitle05Config } from './ContentTitle05/index'; +import { LeftChartsConfig } from './LeftCharts/index'; +import { SearchBoxConfig } from './SearchBox/index'; export default [ TopTitlesConfig, @@ -15,5 +20,10 @@ export default [ ContentBackgroundConfig, ContentTitleConfig, ContentTitle01Config, - // ContentTitle02Config + ContentTitle02Config, + ContentTitle03Config, + ContentTitle04Config, + ContentTitle05Config, + LeftChartsConfig, + SearchBoxConfig ]; diff --git a/src/packages/components/Zhigan/Zhigan/HeadMoreButton/config.ts b/src/packages/components/Zhigan/Zhigan/HeadMoreButton/config.ts index 48ad96f..8edae20 100644 --- a/src/packages/components/Zhigan/Zhigan/HeadMoreButton/config.ts +++ b/src/packages/components/Zhigan/Zhigan/HeadMoreButton/config.ts @@ -20,7 +20,7 @@ export const option = { export default class Config extends PublicConfigClass implements CreateComponentType { public key = HeadMoreButtonConfig.key - public attr = { ...chartInitConfig, w: 80, h: 40, zIndex: 5 } + public attr = { ...chartInitConfig, w: 80, h: 32, zIndex: 5 } public chartConfig = cloneDeep(HeadMoreButtonConfig) public option = cloneDeep(option) } diff --git a/src/packages/components/Zhigan/Zhigan/LowerLeft/config.ts b/src/packages/components/Zhigan/Zhigan/LowerLeft/config.ts new file mode 100644 index 0000000..689b90e --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/LowerLeft/config.ts @@ -0,0 +1,21 @@ +import cloneDeep from 'lodash/cloneDeep' +import { PublicConfigClass } from '@/packages/public' +import { CreateComponentType } from '@/packages/index.d' +import { chartInitConfig } from '@/settings/designSetting' +import { LowerLeftConfig } from './index' + +export const option = { + imageStyle: { + imageWidth: 26, + imageHeight: 28, + bottom: 0, + right: 5, + } +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = LowerLeftConfig.key + public attr = { ...chartInitConfig, w: 400, h: 32, zIndex: -1 } + public chartConfig = cloneDeep(LowerLeftConfig) + public option = cloneDeep(option) +} diff --git a/src/packages/components/Zhigan/Zhigan/LowerLeft/config.vue b/src/packages/components/Zhigan/Zhigan/LowerLeft/config.vue new file mode 100644 index 0000000..81aefe7 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/LowerLeft/config.vue @@ -0,0 +1,52 @@ + + + diff --git a/src/packages/components/Zhigan/Zhigan/LowerLeft/index.ts b/src/packages/components/Zhigan/Zhigan/LowerLeft/index.ts new file mode 100644 index 0000000..35df847 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/LowerLeft/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' + +export const LowerLeftConfig: ConfigType = { + key: 'LowerLeft', + chartKey: 'VLowerLeft', + conKey: 'VCLowerLeft', + title: '组件底部栏', + category: ChatCategoryEnum.ZHIGAN, + categoryName: ChatCategoryEnumName.ZHIGAN, + package: PackagesCategoryEnum.ZHIGAN, + chartFrame: ChartFrameEnum.COMMON, + image: 'LowerLeft.png' +} diff --git a/src/packages/components/Zhigan/Zhigan/LowerLeft/index.vue b/src/packages/components/Zhigan/Zhigan/LowerLeft/index.vue new file mode 100644 index 0000000..0516788 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/LowerLeft/index.vue @@ -0,0 +1,52 @@ + + + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalCarousel/config.ts b/src/packages/components/Zhigan/Zhigan/ModalCarousel/config.ts new file mode 100644 index 0000000..c282b6d --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalCarousel/config.ts @@ -0,0 +1,64 @@ +import cloneDeep from 'lodash/cloneDeep' +import { PublicConfigClass } from '@/packages/public' +import { CreateComponentType } from '@/packages/index.d' +import { chartInitConfig } from '@/settings/designSetting' +import { ModalCarouselConfig } from './index' + +export const option = { + // 图片资源列表 + dataset: [ + 'https://naive-ui.oss-cn-beijing.aliyuncs.com/carousel-img/carousel1.jpeg', + 'https://naive-ui.oss-cn-beijing.aliyuncs.com/carousel-img/carousel2.jpeg', + 'https://naive-ui.oss-cn-beijing.aliyuncs.com/carousel-img/carousel3.jpeg', + ], + buttonStyle:{ + dotBottom: 10, + dotLeft: 120, + dotColor1: '#00611a', + dotColor2: '#00cc13', + + buttonWidth: 20, + buttonHeight: 60, + + buttonBottom: 80, + buttonLeftAndRight: 0, + buttonColor: '#A4A4A4FF', + + iconFontSize: 20, + iconColor: '#1EC233', + + borderWidth: 2, + borderColor: '#008000', + }, + dataStyle: { + // 自动播放 + autoplay: true, + // 自动播放的间隔（豪秒） + interval: 5000, + // 每页显示的图片数量 + slidesPerview: 1, + // 轮播方向 + direction: "horizontal", + // 拖曳切换 + draggable: true, + // 居中显示 + centeredSlides: false, + // 过渡效果 + effect: "slide", + // 是否显示指示点 + showDots: true, + // 指示器样式 + dotType: "line", + // 显示箭头 + showArrow: true, + // 图片样式 + fit: "contain", + } +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = ModalCarouselConfig.key + public attr = { ...chartInitConfig, w: 320, h: 250, zIndex: -1 } + public chartConfig = cloneDeep(ModalCarouselConfig) + public option = cloneDeep(option) +} \ No newline at end of file diff --git a/src/packages/components/Zhigan/Zhigan/ModalCarousel/config.vue b/src/packages/components/Zhigan/Zhigan/ModalCarousel/config.vue new file mode 100644 index 0000000..063acf3 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalCarousel/config.vue @@ -0,0 +1,262 @@ + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalCarousel/index.ts b/src/packages/components/Zhigan/Zhigan/ModalCarousel/index.ts new file mode 100644 index 0000000..f6ca459 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalCarousel/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' + +export const ModalCarouselConfig: ConfigType = { + key: 'ModalCarousel', + chartKey: 'VModalCarousel', + conKey: 'VCModalCarousel', + title: '重复报警弹窗轮播图', + category: ChatCategoryEnum.ZHIGAN, + categoryName: ChatCategoryEnumName.ZHIGAN, + package: PackagesCategoryEnum.ZHIGAN, + chartFrame: ChartFrameEnum.COMMON, + image: 'ModalCarousel.png' +} diff --git a/src/packages/components/Zhigan/Zhigan/ModalCarousel/index.vue b/src/packages/components/Zhigan/Zhigan/ModalCarousel/index.vue new file mode 100644 index 0000000..39ca5ac --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalCarousel/index.vue @@ -0,0 +1,170 @@ + + + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalHead/svg/title.vue b/src/packages/components/Zhigan/Zhigan/ModalHead/svg/title.vue index 82387bd..9d4faa2 100644 --- a/src/packages/components/Zhigan/Zhigan/ModalHead/svg/title.vue +++ b/src/packages/components/Zhigan/Zhigan/ModalHead/svg/title.vue @@ -8,7 +8,6 @@ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" > - 编组 54 diff --git a/src/packages/components/Zhigan/Zhigan/ModalInfo/config.ts b/src/packages/components/Zhigan/Zhigan/ModalInfo/config.ts new file mode 100644 index 0000000..09acd73 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalInfo/config.ts @@ -0,0 +1,42 @@ +import cloneDeep from 'lodash/cloneDeep' +import { PublicConfigClass } from '@/packages/public' +import { CreateComponentType } from '@/packages/index.d' +import { chartInitConfig } from '@/settings/designSetting' +import { ModalInfoConfig } from './index' +import dataJson from './data.json' + +const { source } = dataJson; + +export const option = { + dataset: source, + dataStyle:{ + backgroud: '#FFFFFF00', + marginTop: 10, + marginLeft: 20, + listMarginTop: 0, + listMarginLeft: 0, + }, + titleStyle: { + dotColor: '#C9FFC7', + dotSize: 12, + dotMarginRight: 10, + width: 100, + height: 20, + fontcolor: '#CBE6CD', + fontsize: 16, + align: 'left', + }, + contentStyle: { + width: 250, + fontcolor: '#FFFFFF', + fontsize: 16, + align: 'left', + } +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = ModalInfoConfig.key + public attr = { ...chartInitConfig, w: 400, h: 300, zIndex: -1 } + public chartConfig = cloneDeep(ModalInfoConfig) + public option = cloneDeep(option) +} \ No newline at end of file diff --git a/src/packages/components/Zhigan/Zhigan/ModalInfo/config.vue b/src/packages/components/Zhigan/Zhigan/ModalInfo/config.vue new file mode 100644 index 0000000..56e88f9 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalInfo/config.vue @@ -0,0 +1,154 @@ + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalInfo/data.json b/src/packages/components/Zhigan/Zhigan/ModalInfo/data.json new file mode 100644 index 0000000..84dd1eb --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalInfo/data.json @@ -0,0 +1,28 @@ +{ + "source": [ + { + "title": "预警描述", + "content": "费县马庄镇牛田村村委东北方向375.75°1.197公里处发现火情" + }, + { + "title": "水平角", + "content": "375.75°" + }, + { + "title": "俯视角", + "content": "98°" + }, + { + "title": "经纬度", + "content": "117.90911.3012349" + }, + { + "title": "预警时间", + "content": "2024.12.24 13:08:07" + }, + { + "title": "瞭望塔", + "content": "费县瞭望塔" + } + ] +} diff --git a/src/packages/components/Zhigan/Zhigan/ModalInfo/index.ts b/src/packages/components/Zhigan/Zhigan/ModalInfo/index.ts new file mode 100644 index 0000000..be5d30d --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalInfo/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' + +export const ModalInfoConfig: ConfigType = { + key: 'ModalInfo', + chartKey: 'VModalInfo', + conKey: 'VCModalInfo', + title: '重复报警弹窗信息展示', + category: ChatCategoryEnum.ZHIGAN, + categoryName: ChatCategoryEnumName.ZHIGAN, + package: PackagesCategoryEnum.ZHIGAN, + chartFrame: ChartFrameEnum.COMMON, + image: 'ModalInfo.png' +} diff --git a/src/packages/components/Zhigan/Zhigan/ModalInfo/index.vue b/src/packages/components/Zhigan/Zhigan/ModalInfo/index.vue new file mode 100644 index 0000000..f75ddef --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalInfo/index.vue @@ -0,0 +1,93 @@ + + + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalInfo/svg/dot.vue b/src/packages/components/Zhigan/Zhigan/ModalInfo/svg/dot.vue new file mode 100644 index 0000000..b161988 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalInfo/svg/dot.vue @@ -0,0 +1,94 @@ + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalVideo/config.ts b/src/packages/components/Zhigan/Zhigan/ModalVideo/config.ts new file mode 100644 index 0000000..ce701f4 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalVideo/config.ts @@ -0,0 +1,27 @@ +import cloneDeep from 'lodash/cloneDeep' +import { PublicConfigClass } from '@/packages/public' +import { CreateComponentType } from '@/packages/index.d' +import { chartInitConfig } from '@/settings/designSetting' +import { ModalVideoConfig } from './index' + +export const option = { + dataset: '/src/assets/videos/earth.mp4', + dataStyle: { + backgroud: '#FFFFFF00', + videoloop: true, // 视频-循环播放 + videomuted: true, // 视频-静音 + videofit: 'fill', // 视频-适应方式 + videoMarginTop: 10, + + borderWidth: 2, + borderColor: '#008000', + padding: 4, + } +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = ModalVideoConfig.key + public attr = { ...chartInitConfig, w: 320, h: 220, zIndex: -1 } + public chartConfig = cloneDeep(ModalVideoConfig) + public option = cloneDeep(option) +} diff --git a/src/packages/components/Zhigan/Zhigan/ModalVideo/config.vue b/src/packages/components/Zhigan/Zhigan/ModalVideo/config.vue new file mode 100644 index 0000000..554b17c --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalVideo/config.vue @@ -0,0 +1,91 @@ + + + diff --git a/src/packages/components/Zhigan/Zhigan/ModalVideo/index.ts b/src/packages/components/Zhigan/Zhigan/ModalVideo/index.ts new file mode 100644 index 0000000..b5ad1ed --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalVideo/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' + +export const ModalVideoConfig: ConfigType = { + key: 'ModalVideo', + chartKey: 'VModalVideo', + conKey: 'VCModalVideo', + title: '重复报警弹窗视频组件', + category: ChatCategoryEnum.ZHIGAN, + categoryName: ChatCategoryEnumName.ZHIGAN, + package: PackagesCategoryEnum.ZHIGAN, + chartFrame: ChartFrameEnum.COMMON, + image: 'ModalVideo.png' +} diff --git a/src/packages/components/Zhigan/Zhigan/ModalVideo/index.vue b/src/packages/components/Zhigan/Zhigan/ModalVideo/index.vue new file mode 100644 index 0000000..30e9f60 --- /dev/null +++ b/src/packages/components/Zhigan/Zhigan/ModalVideo/index.vue @@ -0,0 +1,64 @@ + + + + + diff --git a/src/packages/components/Zhigan/Zhigan/index.ts b/src/packages/components/Zhigan/Zhigan/index.ts index 4abcd13..4e56bc5 100644 --- a/src/packages/components/Zhigan/Zhigan/index.ts +++ b/src/packages/components/Zhigan/Zhigan/index.ts @@ -1,24 +1,26 @@ import { GeneralHeadConfig } from "./GeneralHead/index"; -import { ModalHeadConfig } from "./ModalHead/index"; import { HeadMoreButtonConfig } from "./HeadMoreButton/index"; import { WuRenJiImageConfig } from "./WuRenJiImage/index"; import { WeiXingYaoGanConfig } from "./WeiXingYaoGan/index"; import { XianSuoShangBaoConfig } from "./XianSuoShangBao/index"; import { MeiRiShangBaoConfig } from "./MeiRiShangBao/index"; - - import { WuRenJiShiShiHuaMianConfig } from "./WuRenJiShiShiHuaMian/index"; import { WuRenJiFeiXingShuJuConfig } from "./WuRenJiFeiXingShuJu/index"; + import { ModalFrameConfig } from "./ModalFrame/index"; import { ModalFrameCloseConfig } from "./ModalFrameClose/index"; -import { ModalButtonConfig } from "./ModalButton/index"; +import { ModalHeadConfig } from "./ModalHead/index"; +import { ModalCarouselConfig } from "./ModalCarousel/index"; +import { ModalVideoConfig } from "./ModalVideo/index"; +import { ModalInfoConfig } from "./ModalInfo/index"; import { ModalTimeLineConfig } from "./ModalTimeLine/index"; +import { ModalButtonConfig } from "./ModalButton/index"; +import { LowerLeftConfig } from "./LowerLeft/index"; export default [ GeneralHeadConfig, - ModalHeadConfig, HeadMoreButtonConfig, WuRenJiImageConfig, @@ -28,8 +30,15 @@ export default [ WuRenJiShiShiHuaMianConfig, WuRenJiFeiXingShuJuConfig, + + LowerLeftConfig, + ModalFrameConfig, - ModalFrameCloseConfig, + ModalFrameCloseConfig, + ModalHeadConfig, + ModalCarouselConfig, + ModalVideoConfig, + ModalInfoConfig, + ModalTimeLineConfig, ModalButtonConfig, - ModalTimeLineConfig ]; diff --git a/src/store/modules/chartEditStore/chartEditStore.ts b/src/store/modules/chartEditStore/chartEditStore.ts index c63dcdd..71a920d 100644 --- a/src/store/modules/chartEditStore/chartEditStore.ts +++ b/src/store/modules/chartEditStore/chartEditStore.ts @@ -528,6 +528,7 @@ export const useChartEditStore = defineStore({ type: isCut ? HistoryActionTypeEnum.CUT : HistoryActionTypeEnum.COPY, }; this.setRecordChart(copyData); + localStorage.setItem('copyData', JSON.stringify(copyData)); window['$message'].success(isCut ? '剪切图表成功' : '复制图表成功！'); loadingFinish(); } @@ -541,9 +542,13 @@ export const useChartEditStore = defineStore({ }, // * 粘贴 setParse() { + console.log('setParse'); try { loadingStart(); - const recordCharts = this.getRecordChart; + const recordCharts = this.getRecordChart + ? this.getRecordChart + : JSON.parse(localStorage.getItem('copyData')); + if (recordCharts === undefined) { loadingFinish(); return; diff --git a/src/store/modules/packagesStore/packagesStore.d.ts b/src/store/modules/packagesStore/packagesStore.d.ts index 0507895..e3fbed2 100644 --- a/src/store/modules/packagesStore/packagesStore.d.ts +++ b/src/store/modules/packagesStore/packagesStore.d.ts @@ -5,5 +5,5 @@ export { ConfigType } export { PackagesType } export interface PackagesStoreType { packagesList: PackagesType, - newPhoto?: ConfigType + newPhoto?: ConfigType[] } diff --git a/src/store/modules/packagesStore/packagesStore.ts b/src/store/modules/packagesStore/packagesStore.ts index 2911731..6a5dcd2 100644 --- a/src/store/modules/packagesStore/packagesStore.ts +++ b/src/store/modules/packagesStore/packagesStore.ts @@ -17,9 +17,9 @@ export const usePackagesStore = defineStore({ } }, actions: { - addPhotos(newPhoto: ConfigType, index: number) { + addPhotos(newPhoto: ConfigType[], index: number) { this.newPhoto = newPhoto - this.packagesList.Photos.splice(index, 0, newPhoto) + this.packagesList.Photos.splice(index, 0, ...newPhoto) }, deletePhotos(photoInfo: ConfigType, index: number) { this.packagesList.Photos.splice(index, 1) diff --git a/src/views/chart/ContentCharts/components/ChartsOptionContent/index.vue b/src/views/chart/ContentCharts/components/ChartsOptionContent/index.vue index 72e0a37..1a00c8c 100644 --- a/src/views/chart/ContentCharts/components/ChartsOptionContent/index.vue +++ b/src/views/chart/ContentCharts/components/ChartsOptionContent/index.vue @@ -105,10 +105,10 @@ watch( watch( () => packagesStore.newPhoto, newPhoto => { - if (!newPhoto) return - const newPhotoCategory = newPhoto.category - packages.categorys[newPhotoCategory].splice(1, 0, newPhoto) - packages.categorys['all'].splice(1, 0, newPhoto) + if (!newPhoto || newPhoto.length <= 0) return + const newPhotoCategory = newPhoto[0].category + packages.categorys[newPhotoCategory].splice(1, 0, ...newPhoto) + packages.categorys['all'].splice(1, 0, ...newPhoto) } ) diff --git a/src/views/chart/ContentCharts/components/PhotoModal/index.vue b/src/views/chart/ContentCharts/components/PhotoModal/index.vue index 563c0bf..c49154e 100644 --- a/src/views/chart/ContentCharts/components/PhotoModal/index.vue +++ b/src/views/chart/ContentCharts/components/PhotoModal/index.vue @@ -7,20 +7,20 @@
-
+
- - + +
{ return } const userPhotosList: ConfigType[] = getLocalStorage(StoreKey) || [] + const addNewPhotosList: ConfigType[] = [] selectPhotoList.value.forEach(item => { const newPhoto = { ...ImageConfig, @@ -126,9 +127,11 @@ const addPhotoToList = () =>{ redirectComponent: `${ImageConfig.package}/${ImageConfig.category}/${ImageConfig.key}` // 跳转组件路径规则：packageName/categoryName/componentKey } userPhotosList.unshift(newPhoto) - packagesStore.addPhotos(newPhoto, 1) + addNewPhotosList.unshift(newPhoto) }) setLocalStorage(StoreKey, userPhotosList) + packagesStore.addPhotos(addNewPhotosList, 1) + selectPhotoList.value = [] closeModal() } @@ -177,6 +180,7 @@ const addPhotoToList = () =>{ background-color: rgb(24,24,28); margin-bottom: 10px; margin-right: 10px; + cursor: pointer; .select-div{ position: absolute; bottom: 0px; diff --git a/src/views/chart/ContentConfigurations/components/hooks/eventData.hook.ts b/src/views/chart/ContentConfigurations/components/hooks/eventData.hook.ts index 9a1cb00..c86e1b9 100644 --- a/src/views/chart/ContentConfigurations/components/hooks/eventData.hook.ts +++ b/src/views/chart/ContentConfigurations/components/hooks/eventData.hook.ts @@ -14,6 +14,14 @@ export const eventTypeOptions: EventOptionsItemType[] = [ label: '右击', value: 'rightclick', }, + { + label: '鼠标移入', + value: 'mousein', + }, + { + label: '鼠标移出', + value: 'mouseout', + }, ]; // * 动作类型 export const movementTypeOptions: EventOptionsItemType[] = [ diff --git a/src/views/chart/ContentConfigurations/index.vue b/src/views/chart/ContentConfigurations/index.vue index 5c4fca0..6bb6805 100644 --- a/src/views/chart/ContentConfigurations/index.vue +++ b/src/views/chart/ContentConfigurations/index.vue @@ -37,7 +37,13 @@ - + diff --git a/src/views/chart/ContentEdit/components/EditGroup/index.vue b/src/views/chart/ContentEdit/components/EditGroup/index.vue index 03cced4..cd8a984 100644 --- a/src/views/chart/ContentEdit/components/EditGroup/index.vue +++ b/src/views/chart/ContentEdit/components/EditGroup/index.vue @@ -12,7 +12,7 @@ ...useSizeStyle(groupData.attr), ...getFilterStyle(groupData.styles), ...getTransformStyle(groupData.styles), - ...getBlendModeStyle(groupData.styles) as any + ...(getBlendModeStyle(groupData.styles) as any), }" @click="mouseClickHandle($event, groupData)" @mousedown="mousedownHandle($event, groupData)" @@ -29,7 +29,7 @@ :item="item" :hiddenPoint="true" :style="{ - ...useComponentStyle(item.attr, groupIndex) + ...useComponentStyle(item.attr, groupIndex), }" > @@ -51,79 +51,88 @@ diff --git a/src/views/chart/ContentEdit/components/EditShapeBox/index.vue b/src/views/chart/ContentEdit/components/EditShapeBox/index.vue index e42c5e2..e36523b 100644 --- a/src/views/chart/ContentEdit/components/EditShapeBox/index.vue +++ b/src/views/chart/ContentEdit/components/EditShapeBox/index.vue @@ -21,149 +21,149 @@ diff --git a/src/views/preview/components/PreviewRenderGroup/index.vue b/src/views/preview/components/PreviewRenderGroup/index.vue index f72ea98..95b115d 100644 --- a/src/views/preview/components/PreviewRenderGroup/index.vue +++ b/src/views/preview/components/PreviewRenderGroup/index.vue @@ -5,6 +5,11 @@ ...getSizeStyle(groupData.attr), ...getFilterStyle(groupData.styles), }" + @click="clickBtn" + @dblclick="dblclickBtn" + @contextmenu="rightclickBtn" + @mouseenter="mouseenterBtn" + @mouseleave="mouseleaveBtn" >