数据大屏

1. 业务场景

数据大屏是利用相应的系统来分析数据,通过图形的形式为企业提供客观、直接的数据分析结果,让业务人员和企业决策者直观面对数据背后的信息,实时监测企业数据,给予更直观的决策场景体验,助力企业数字化运营升级。

2. 操作流程

1)进入数据可视化,进入数据大屏tab,维护分组信息;

2)在二级分组名称后点击“+”【添加数据大屏】,对数据大屏进行设计;

3)创建完成后可以【编辑】数据大屏;

4)数据大屏完善后,可以点击【发布】数据大屏,则数据大屏此时可以被显示器引用播放;

5)如果数据大屏有更新,则可以点击【更新发布】;

6)如果数据大屏数据不再可以公开使用,则需要通过【隐藏】功能将数据大屏的引用权限收起,但不影响已被使用的数据大屏;

7)隐藏后可以【取消隐藏】,数据大屏恢复隐藏前的状态和功能,可以被引用 。

3. 操作流程图解

3.1 创建分组

1)操作流程:创建分组

2)操作路径:数据可视化-数据大屏-创建分组

3)点击搜索框后的「+」创建一级分组,输入一级分组名称后,点击一级分组后的「+」创建二级分组,输入二级分组名称后,此时分组创建完成,可以在二级分组下创建数据大屏

3.2 编辑分组名称

1)操作流程:选择分组-编辑分组名称

2)操作路径:数据可视化-数据大屏-编辑分组名称

3)鼠标移动至需要修改的分组上,点击出现的「编辑图标」,可以修改分组名称,修改后分组名称实时更新

3.3 删除分组

1)操作流程:选择分组-删除分组

2)操作路径:数据可视化-数据大屏-删除分组

3)鼠标移动至需要删除的分组上,当分组下无报表时出现「删除图标」,可以点击图标后删除分组,删除一级分组时对应所有的二级分组也会被删除,删除后消失,只有分组下没有数据大屏的分组才能直接删除成功

3.4 创建数据大屏

1)操作流程:选择二级分组-创建数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-创建数据大屏

3)鼠标移动至需要创建数据大屏的二级分组上,出现「+」,点击图标后=需要填写数据大屏标题

a数据大屏标题:最大支持20个字,支持汉字、数字、大小写字母、-;同个一级分组下不允许重复;

4)输入标题后进入设计页面

image.png

3.5 编辑数据大屏

1)操作流程:选择数据大屏-编辑数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-编辑数据大屏

3)只能编辑未发布或者已发布但没有被隐藏的数据大屏,且存在三种编辑情况

a. 第一种:点击数据大屏标题后的编辑图标,仅能编辑数据大屏标题;

b. 第二种:点击数据大屏中的数据大屏标题、备注后的编辑图标,可以直接编辑数据大屏标题;

c. 第三种:点击【编辑】按钮,进入数据大屏设计页面,带出已有的组件内容,编辑时的规则与创建时一致,编辑后可以点击保存进行更新,如果未保存直接返回,则编辑无效;

4)编辑后实时生效,数据大屏信息保持展示最新效果

3.6 删除数据大屏

1)操作流程:选择数据大屏-删除数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-删除数据大屏

3)未发布或者已发布但没有被隐藏的数据大屏,并且没被引用,才展示数据大屏菜单名称后的删除图标

4)删除后数据大屏消失

3.7 复制

1)操作流程:选择数据大屏-复制数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-复制数据大屏

3)点击【复制】按钮,复制成功,名称为copy of 原数据大屏标题,展示在原数据大屏分组的最后一个

3.8 发布

1)操作流程:选择数据大屏-发布数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-发布

3)选择单个未发布且没有被隐藏的数据大屏,点击【发布】按钮,数据大屏状态变为已发布,展示最近发布时间;

4)如果数据大屏发布后有更新内容,会展示的更新类型:更新数据大屏信息/更新数据大屏内容

3.9 查看最近一次发布的版本

1)操作流程:选择数据大屏-查看最近一次发布的版本

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更新发布数据大屏

3)当数据大屏发布后有更新,在最近发布时间左侧展示【查看】,在最近发布时间下展示更新的类型,点击查看可以查看最近发布的版本

3.10 更新发布

1)操作流程:选择数据大屏-更新发布数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更新发布数据大屏

3)选择单个已发布且没有被隐藏的数据大屏,并且该数据大屏在上次发布后有所更新,可以点击【更新发布】按钮,将最新的数据大屏内容发布至业务系统,业务系统引用的数据大屏为最新内容;

4)如果更新了内容,但未点击更新发布,则展示的仍是上次发布的数据大屏

3.11 隐藏

1)操作流程:选择数据大屏-隐藏数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-隐藏数据大屏

3)数据大屏默认不隐藏,点击数据大屏左侧的是否隐藏可以切换

a. 未发布的数据大屏,较隐藏前,不可以操作【发布】,可以【取消隐藏】;

b. 已发布的数据大屏,较隐藏前,只能操作【导出图片、导出excel、取消隐藏】;

4)隐藏后的数据大屏不可以被用于展示在其他大屏上,但不影响已经被引用的数据

3.12 取消隐藏

1)操作流程:选择数据大屏-取消隐藏数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-取消隐藏数据大屏

3)隐藏后的数据大屏可以取消隐藏,切换是否隐藏=否,取消隐藏后,数据大屏恢复隐藏前的状态和功能,可以被引用

3.13 查看引用

1)流程:选择图表-查看被哪些报表/数据大屏/页面引用

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更多-查看引用

3)选择具体的数据大屏,查看当前数据大屏被引用的所有信息

3.14 不允许别人编辑

1)流程:选择数据大屏-不允许别人编辑

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更多-不允许别人编辑

3)选择自己创建的数据大屏,对数据大屏是否允许其他人编辑进行设置;如果设置为不允许,则其他人无法编辑数据大屏

3.15 不允许别人引用

1)流程:选择图表-更多-不允许别人引用

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更多-不允许别人引用

3)选择自己创建的数据大屏,对数据大屏是否允许他人引用进行设置;如果设置为不允许,则其他人无法选择到

3.16 导出图片

1)操作流程:选择数据大屏-导出图片

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-导出图片

3)选择数据大屏后,点击【导出图片】按钮可以将当前数据大屏导出为图片

3.17 导出EXCEL

1)操作流程:选择数据大屏-导出EXCEL

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-数据大屏导出EXCEL

3)选择数据大屏后,点击【导出EXCEL】按钮可以将当前数据大屏包含的图表导出为EXCEL

4. 数据大屏设计页面

4.1 缩放自适应

1)流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)进入页面后,默认按照当前屏幕展示最适合的数据大屏尺寸,可以通过+、-进行自定义缩放,每次缩放10%

4.2 全屏

1)流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)进入页面后,设置完成,可以【全屏】查看效果,按esc退出全屏

4.3 保存

1) 流程:创建数据大屏-进入数据大屏设计页面

2) 操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3) 进入页面后,设置完成后进行保存,数据大屏保持最新内容

4.4 添加、编辑、删除组件

1)流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)可以添加图表、文本、通用标题、倒计时、时间器、图片、轮播图、视频、边框等组件;图表组件中,一个图表只能添加一次,其他组件不限制数量;

4)所有组件添加后均可进行设置样式,有编辑权限的图表组件可以通过【编辑】图标直接进入图表设计页面;

5)添加后均可删除,删除后组件不再展示在数据大屏画布中,可以重新添加

4.5 数据大屏设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)设置数据大屏时可以设置屏幕的宽高、背景颜色、背景图片、主题

a. 宽高:根据数据大屏需要投放的屏幕大小进行设置;

b. 背景颜色:当数据大屏无图片背景时可以调整背景颜色;

c. 背景图片:支持为数据大屏上传一张图片作为背景;

d. 主题模版:可任选其一,需要先选定模版后再进行设计,不然设计完后再修改模版,会清空已选组件。

image.png

4.6 图表组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入图表组件,可与边框合为一体,可以设置图表的显示内容、边框信息、动画效果、刷新频率

a. 图表显示内容:展示标题、副标题、描述、标签、图例,一屏展示条数,原图表有的内容在设置展示后展示在数据大屏,原图表没有的内容设置展示后不生效;

b. 边框信息:包括边框样式、背景颜色、边框线条颜色、展示边框标题、边框标题内容、边框标题颜色、边框标题字体大小;

c. 动画效果:可以设置自动轮播,为是时可以设置结束后停顿时长、速度、切换形式;

d. 刷新频率:设置图表获取数据的频率,自动刷新、刷新频率。

4.7 文本组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入文本组件后,可以输入多行文本,可以设置内容、对齐方式、字体大小、字体加粗、字体颜色、背景颜色、边框样式、文字滚动、结束后停顿、速度

4)当文字滚动开启时,文字会按照一行展示,通过设置结束后停顿和速度来控制文字滚动的效果

image.png

4.8 通用标题组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)默认根据主题展示标题的样式,可选择自定义,选择后,需要设置标题的字体大小、对齐方式、字体颜色、字体背景颜色等内容

image.png

image.png

4.9 倒计时组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)倒计时需要选择一个未来的时间

4.10 时间器组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入后可以设置组件名称、字体大小等

image.png

4.11 图片组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)选择图表组件后,需要上传图片,支持上传的图片格式:bmp、jpg、jpeg、png、gif,可以为图片设置链接,点击即可跳转

image.png

4.12 轮播图组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入后需要按照轮播图的图片数量上传图片,支持上传的图片格式:bmp、jpg、jpeg、png、gif,每张图都可以贴对应的链接

4)如果设置非自动轮播则需要手动切换,设置自动轮播则需要设置轮播速度和效果

image.png

4.13 视频组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)需要上传视频,支持上传的视频格式:AVI、WMV、MPEG、QuickTime、RealVideo、Flash、Mpeg-4、mkv

image.png

4.14 样式组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)包括边框一、二、三,以及线条、圆形、矩形的设置,用于不使用主题模版时自定义数据大屏

Oinone社区 作者:史, 昂原创文章,如若转载,请注明出处:https://doc.oinone.top/oio4/9424.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

Like (0)
史, 昂's avatar史, 昂数式管理员
Previous 2024年6月20日 am9:49
Next 2024年6月20日

相关推荐

  • 陈浩

    自2017年中国推进数字建设以来,数字经济规模持续增长,“十四五”规划和2035远景目标纲要中明确强调企业和政府需大力推动数字化转型,中国正在迈进一个崭新的数字经济时代。 在这个过程中,软件已经从工具变成信息化的基础设施,如何有效应对该变化所带来的一系列新的核心技术挑战,是整个软件行业发展遇到的另一难题。我认为,开源创新是解决这些难题的有效手段之一,也是未来软件发展的重要方向。如果说,数字化转型是时代趋势,那么开源创新也已成为时代主流。十四五规划纲要首提开源,2021年11月工信部印发《十四五软件和信息技术服务业发展规划》中提到开源重塑软件发展新生态,并将开源重塑软件发展新生态作为十四五期间我国软件产业的四大发展形势之一进行重点阐述。支持国产化开源创新体系发展,建设自己的开源社区和开源平台,其所具有的大众协同、开放共享、持续创新等特点,可有效推动各行业自主可控的数字化转型。 Oinone所倡导的开源理念和生态共建,与国家开源战略不谋而合:将开源作为一种合作手段,通过完善社区注重开源治理,吸引更多的企业和个体参与其中。湖南大学作为首批国家示范性软件学院的双一流建设高校,一直致力于推进和引导国产化开源软件体系的建设,并为此开展多种形式的产学研研究和实践。基于Oinone微服务分布式的设计理念和面向生态的开源特性,湖南大学结合自身在大数据分布式存储、多元异构数据汇聚融合和大数据智能分析等方面的研究成果,与Oinone展开了深度的技术创新合作,并在多个大中型企业数字化应用和数字政府应用中取得了良好的效果。 随着Oinone的开源,相信能激发更多的开发者参与到国产软件建设中,通过开源模式实现更广泛参与方的共享、共创、共生、共赢,构建价值驱动的数字创新生态平台,为我国数字经济发展贡献科技力量。 湖南大学教授:陈浩

    Oinone 7天入门到精通 2024年5月23日
    2.0K00
  • 3.5.7.6 自定义字段

    字段是什么 字段的基本概念 定义:字段通常指的是数据的一个单独项,它可以是一个文本框、下拉菜单、复选框等,用于在用户界面上收集或展示数据。 用途:在表单中,字段用于收集用户输入;在表格或列表中,字段用于显示数据。 类型:字段可以有不同的类型,如文本、数字、日期等,这些类型通常由数据模型定义。 Oinone框架中的字段 在Oinone框架中,字段的设计和实现遵循以下原则: 后端模型驱动:前端的字段直接由后端的数据模型决定。这意味着后端定义了哪些数据应该展示,以及如何展示。 减少前后端联调:由于字段的定义和行为是由后端控制的,前后端的联调需求大大减少。前端开发者主要关注于如何呈现这些字段,而后端则负责数据的逻辑和结构。 灵活性与规范性:虽然Oinone推荐所有场景都遵循后端模型驱动字段的原则,以保持前后端的一致性和减少沟通成本,但它也为高度定制化的前端页面提供了灵活性。 元数据使用:Oinone可能还使用元数据来进一步定义字段的行为,例如它们是否可见、如何验证用户输入等。 结合前后端 在使用Oinone时,理解前后端如何合作来定义和展示字段是很重要的。这种方法不仅提高了开发效率,而且有助于确保数据的一致性和应用程序的可维护性。同时,对于那些需要特定定制或特殊处理的场景,开发团队能够灵活地适应这些需求,在遵守总体架构原则的同时进行一些特定的调整和优化。 作用场景 在Oinone框架中,字段扮演着连接后端数据模型和前端用户界面的重要角色。其作用场景包括但不限于以下几点: 业务组件的核心: Oinone集成了AntdDesignVue的全部UI组件,将它们转化为业务组件。这些业务组件以字段的形式存在,使得前端开发变得简单高效。开发人员可以直接使用这些现成的业务组件来构建用户界面,大大减少了开发工作量。 无代码开发支持: 字段的设计使得Oinone支持无代码开发。开发者可以通过拖拉拽的方式在前端快速构建界面,而后端模型的定义直接决定了这些界面的生成。这种模式简化了传统的前端开发流程,提升了开发效率。 个性化定制: 虽然标准的UI组件可以满足大部分需求,但复杂多变的业务场景往往需要更多个性化的处理。在Oinone中,开发者可以根据具体业务需求和公司的UI指南,定义专门针对特定行业或客户的定制化字段和组件。 与无代码平台的结合: Oinone允许将个性化的字段和组件与无代码平台相结合。这意味着即使在进行个性化定制时,也能保持使用无代码工具的便利性,实现更灵活、更高效的前端开发。 适应多维度业务需求: 由于字段在Oinone中的灵活性和可定制性,它们能够适应多维度的业务需求,无论是从UI设计、用户体验还是业务逻辑的角度,字段都能提供合适的解决方案 自定义字段 示例工程目录 以下是需关注的工程目录示例,main.ts更新导入./field: 图3-5-7-24 自定义字段工程目录示例 示例代码 创建自定义字段组件: 使用Vue框架创建一个新的组件(例如 CustomStringFieldVue),并定义其模板、脚本和样式。 在模板中定义字段的HTML结构。 在脚本中使用 defineComponent 来定义Vue组件。 字段类的定义: 导入必要的模块,如 FormFieldWidget, ModelFieldType, SPI, ViewType 等。 使用 @SPI.ClassFactory 装饰器来注册自定义字段。 在类内部初始化并设置组件。 SPI注册参数解释: viewType: 指定视图类型,如表单视图或搜索视图。 widget: 可以指定组件名称。 ttype: 字段的业务类型,例如字符串、数字等。 multi: 指明字段是否支持多值。 model: 定义字段所属的模型。 viewName: 指定视图名称。 name: 定义所属字段的名称。 import {FormFieldWidget, ModelFieldType, SPI, ViewType} from '@kunlun/dependencies'; import CustomStringFieldVue from './CustomStringField.vue'; @SPI.ClassFactory( FormFieldWidget.Token({ viewType: [ViewType.Form, ViewType.Search], ttype: ModelFieldType.String }) ) export class CustomStringField extends FormFieldWidget { public initialize(props) { super.initialize(props); this.setComponent(CustomStringFieldVue); return this; } } 图3-5-7-24 自定义字段组件(TS)示例 <template> <div class="custom-string-filed-wrapper"> 字段组件 </div> </template> <script lang="ts"> import { defineComponent } from 'vue' export default defineComponent({ inheritAttrs: false, name: 'CustomStringFieldVue' }) </script> <style lang="scss"> .custom-string-filed-wrapper { } </style> 图3-5-7-24 自定义字段组件(Vue)示例 效果 图3-5-7-24 自定义字段效果示例

    2024年5月23日
    1.9K00
  • 页面设计

    1. 功能说明 页面设计时界面设计器中「页面」模块的设计入口,在这个界面,进行页面的设置、搭建、设计、排版。 主要分为顶部操作栏、左侧工具栏、中部设计画布区、右侧属性面板。 2. 操作栏 进入页面设计,顶部显示了页面的标题,以及返回、发布等操作。 2.1 发布 页面设计完成后,点击「发布」运行页面生效。若不点击发布,页面也有自动保存的功能,但在发布前,自动保存也等同于草稿,不会正式生效。 发布时如果有属性不符合校验规则(必填的属性未填、输入的内容校验不通过),会发布失败,相应的字段会特殊标记,需要查看并修改属性。 2.2 显示/隐藏母版 进入页面设计时默认不展示母版,可以手动操作显示母版 3. 工具栏 左侧的工具栏中包括组件库、页面设置等模块。 3.1 组件库 组件库中包含组件和模型,组件是当前设计器支持的所有组件,模型是页面所在模型下的所有字段和动作。 3.1.1 组件 组件中展示了系统支持的所有组件。包含 1)布局类组件,如分组、选项卡等,使用布局组件可以将页面进字段分类、分页; 2)字段类组件,如单行文本、整数、日期等等,使用字段类组件时都会在模型下对应创建一个字段; 3)动作类组件,如跳转动作、提交动作、链接动作等。 3.1.2 模型 组件库顶部,由组件可切换为模型:模型选项下,会展示当前模型的所有字段,以及系统默认动作。可以直接拖拽字段至设计画布中,会应用形成某个组件,可对组件进行多样的属性设置,优化交互。 3.1.2 组件和模型有什么区别 1展示内容维度不同 组件中展示的内容是组件信息,如分组、选项卡、单行文本、文件上传等;模型中展示的是模型下已有的所有字段。 2使用功能不同 组件中的组件使用前需要在模型中创建一个字段,当然,创建好的字段也会存在于模型中;模型中的字段可直接使用,并且使用时会在设计画布中对应生成个默认组件。 3使用场景不同 如果模型中已经存在目标字段,应直接选择从模型中拖拽字段;如果模型中没有需要的字段,可以在页面中增加一个组件,实际上也是在新增一个字段。 3.2 页面设置 页面设置中可以修改当前页面的标题、分组、页面描述,同时也是给页面上传缩略图的唯一入口。 4. 设计画布 将组件或字段拖拽至设计画布区,会生成样式。点击组件,右侧可对其进行设置,大部分属性可实时在画布中展示效果。 5. 属性面板 右侧属性面板抽屉中可以设置属性或查看字段信息,通过不同的属性配置化实现组件的多样化。 5.1 属性 属性中包括基本信息(如标题、占位提示、描述说明等)、校验信息(如是否必填、长度校验等)、交互信息(如排序方式、是否展示计数器等) 5.2 字段 首次从组件中拖拽,会先展示字段信息,并且是需要先创建一个字段,字段创建成功后,再次切换字段选项,只读展示当前组件所对应的字段基本信息。同理,如果是直接从字段中拖拽,字段选项中,只读展示当前字段基本信息。

    2024年6月20日
    3.8K00
  • 数据字典

    1. 什么是数据字典 数据字典是一些固定字典项的集合,可作为多选或单选的选项,例如人员性别、员工属相、杭州市下属的行政区等都是数据字典。 选择一个应用/模块下的一个小模块,可以查看其中包含的自定义字典(自建的数据字典)和系统字典。可以通过导入或添加创建自定义字典。 2. 数据字典基本操作 删除:系统字典不支持删除,无法批量删除自定义数据字典,若数据字典已经被字段、页面等引用时,也无法删除这个数据字典。 隐藏/可见:自定义字典、系统字典都可以操作隐藏和可见,隐藏和可见不影响数据字典在字段、页面等处的使用。 查看引用关系:点击查看引用关系,展开弹窗,展示该数据字典和字段、视图的引用关系。 修改:若数据字典已经被引用,无法删除其中的字典项。若无引用关系则可以任意修改。 3. 数据字典导入 点击“导入数据字典”按钮,弹出窗口,可根据图中引导进行数据字典的导入。 在经典模式下,导入数据字典会新建数据字典。 在专家模式下,数据字典导入的模板中包含字段“字典编码”,若导入的字典编码不存在则会新建数据字典,若导入的字典编码已存在则会修改字典编码的设置,新建和修改的动作会校验是否符合规范。 4. 数据字典创建 4.1 专家模式(低代码模式) 字典项类型有“二进制、文本、整数”三种可选,选择二进制时,字典项值需要选择存储在数据库二进制中的第几位。系统根据字典项值去查找字典项名称,因此字典项值不可重复。 数据字典的api名称、代码名称、描述可不填,部分系统会赋默认值。 字典项中字典项名称和字典项值必填,api名称和字典项描述不填系统会赋默认值。 4.2 经典模式(无代码模式) 经典模式下只需要填写字典名称,添加字典项即可。系统会自动将字典项类型设置为“二进制”,并将字典项按照创建的先后顺序设置字典项值的位数。字典项类型、字典项值释义可参照专家模式的解释。

    2024年6月20日
    2.0K00

Leave a Reply

Please Login to Comment