KR101951719B1 - A web reporting design system with programming event handling by using graphic interface - Google Patents

Abstract

The present invention relates to a web reporting design system for programming an event action based on a graphic interface capable of writing a report provided on a web by utilizing a database where big data is accumulated. More specifically, the present invention relates to the web reporting design system for programming an event action based on a graphic interface capable of providing event handling functions as a graphical interface for programming to write interactive reports on a web. The web reporting design system includes: a screen editing unit for arranging a plurality of control objects and setting properties of the arranged control objects to edit a screen of a web reporting page; a data connection unit for connecting a data set to a control object in the web reporting page; an operation setting unit for setting an event operation to a control object in the web reporting page; and a document generation unit configured to generate an editing result as a web reporting document by reflecting the editing result of the web reporting page. According to the above system, the screen layout of the control object, data set connection, event operation setting, and the like are all performed in a WYSIWYG scheme and a drag-and-drop scheme. Even nonprofessionals who do not know the programming language at all can write interactive web report pages.

Description

Translated fromKorean

그래픽 인터페이스 기반으로 이벤트 동작을 프로그래밍 하는 웹 레포팅 디자인 시스템 { A web reporting design system with programming event handling by using graphic interface }[0001] The present invention relates to a web reporting design system for programming an event operation based on a graphic interface,

본 발명은 빅 데이터 등 축적된 데이터베이스를 활용하여 웹 상에서 제공하는 보고서를 작성하되, 특히, 웹 상의 인터랙티브 보고서를 위해 이벤트 핸들링 기능을 그래픽 인터페이스로 프로그래밍 하도록 제공하는, 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 관한 것이다.The present invention relates to a graphical interface-based web reporting design system, which provides a report provided on the web by utilizing accumulated databases such as big data, and in particular, provides an event handling function for programming an interactive report on the web using a graphical interface will be.

일반적으로 비즈니스 인텔리전스(BI, Business Intelligence)는 기업의 방대한 데이터를 통계분석과 같은 정형 또는 비정형적인 방법으로 다양하게 분석하여 주거나 분석된 정보를 이해하기 쉽고 보기 좋은 보고서 형태로 가공하여, 비즈니스를 보다 합리적으로 진행시킬 수 있도록 지원하는 일련의 도구들을 말한다. 기업이 비즈니스를 하면서 쌓이는 데이터는 수없이 많다. 이러한 데이터는 비즈니스 현장의 생생한 내용을 전달하는 것으로서, 제대로 분석된다면 그 안에서 비즈니스에 필요한 정보를 뽑아낼 수 있다.Generally, business intelligence (BI) analyzes a company's vast amount of data in a formal or informal manner, such as statistical analysis, or processes the analyzed information into an easy-to-understand and easy-to-understand report, To a set of tools that allow you to proceed to There are a lot of data that companies accumulate as they do business. These data convey the vividness of the business scene, and if it is properly analyzed, it can extract the information needed for the business.

그러나 현장에서 축적된 상당량의 데이터로부터 의미가 있는 분석결과를 도출한다는 것은 그리 쉬운 작업이 아니다. 또한, 종래의 비즈니스 인텔리전스(BI)는 다양한 분석도구들을 모아 놓았으나, 사용자들은 다양한 분석도구들을 다루기 위해서 숙련된 지식을 갖추어야 했기 때문에 특정 분석이외에는 보편적으로 이용되기 어려웠다.However, it is not so easy to draw meaningful analysis results from the large amount of data accumulated in the field. In addition, conventional business intelligence (BI) has gathered a variety of analytical tools, but it was difficult to use them universally, except for specific analyzes, because users had to be skilled in dealing with various analytical tools.

상기와 같은 문제점을 해결하기 위하여, 웹 환경에서 데이터베이스를 조회하여 분석하는 레포팅 기술이 제시되고 있다[특허문헌 1]. 상기 선행기술에 의하면, 개발자가 데이터베이스 서버의 데이터를 이용하여 위지윅(WYSIWYG) 방식 및 드래그 앤 드롭(Drag & Drop) 방식으로 보고서를 설계하고, 웹서버는 설계된 보고서를 등록받고, 보고서의 설정내용에 따라 데이터베이스 서버에서 필요한 데이터를 가져와서 보고서를 생성하고, 사용자는 웹브라우저 상에서 보고서를 요청하여 본다.In order to solve the above problems, a reporting technology for searching and analyzing a database in a web environment has been proposed (Patent Document 1). According to the prior art, a developer designes a report using a WYSIWYG method and a drag & drop method using data of a database server, and the web server registers a designed report, Then, the database server obtains necessary data to generate a report, and the user requests a report on the web browser.

또한, 웹 서비스를 이용하여, 여러 곳에 분산된 데이터를 접근하고 통합하여 보고서를 실시간으로 출력하는 기술도 제시되고 있다[특허문헌 2]. 또한, 관리자가 데이터베이스에서 수신한 테이블 정보를 웹 상에서 선택하여 맵핑 테이블을 생성하고, 이를 이용하여 다양한 양식의 BI 레포트를 생성하고, 사용자가 생성된 다양한 양식의 BI 레포트를 웹 상에서 선택하여 확인하는 기술도 제시되고 있다[특허문헌 3].In addition, a technology for accessing and integrating data distributed in various places using a web service and outputting a report in real time has been proposed [Patent Document 2]. In addition, the administrator can select the table information received from the database on the web to generate the mapping table, generate the BI reports of various forms by using them, and select the BI reports of the various forms created by the user on the web [Patent document 3].

일반적으로 웹 페이지를 디자인 개발할 때, 웹 페이지 상의 화면 구성과, 인터랙티브(interactive) 인터페이스를 위한 이벤트 핸들링 기능을 작성해야 한다. 앞서 선행기술들과 같이, 웹 페이지 상의 화면 구성은 위지윅(WYSIWYG) 방식 및 드래그 앤 드롭(Drag & Drop) 방식 등으로 쉽고 간단하게 디자인할 수 있다.Generally, when designing a web page, it is necessary to create a screen configuration on the web page and an event handling function for an interactive interface. Like the prior art, the screen configuration on the web page can be easily and simply designed with the WYSIWYG method and the drag & drop method.

그러나 웹 페이지 상에서 인터랙티브(interactive) 인터페이스를 구성하기 위해서는, 특정 대상에 대한 클릭, 더블 클릭 등 제스쳐(또는 이벤트)를 입력하면, 특정 행위가 수행되도록 구성해야 한다. 즉, 웹 페이지 상에서 특정 이벤트가 발생하면 해당 이벤트에 대응하는 작업이 수행되도록, 이벤트 작업을 사전에 정의해주어야 한다.However, in order to construct an interactive interface on a web page, a specific action must be performed by inputting a gesture (or event) such as a click or a double click on a specific object. That is, if a specific event occurs on a web page, the event task should be defined in advance so that the corresponding task is performed.

일반적으로 이러한 이벤트 작업(또는 이벤트 핸들링)을 웹 프로그래밍을 통해 작성한다. 예를 들어, JSP(JavaServer Pages), ASP(Active Server Pages), PHP(Hypertext Preprocessor) 등 서버 측 웹 프로그램을 이용하여, 이벤트 핸들링이 정의되거나 작성된다. 그러나 상기와 같은 웹 프로그램은 전문가들에 의해서만 작성될 수 있다. 즉, 웹 프로그래밍 언어를 배우고 작성할 줄 아는 경우에만, 이벤트 핸들링의 작업을 정의하거나 작성할 수 있다.Typically, these event tasks (or event handling) are written through Web programming. For example, event handling is defined or created using server-side Web programs such as JavaServer Pages (JSP), Active Server Pages (ASP), and Hypertext Preprocessor (PHP). However, such a web program as described above can be written only by experts. In other words, you can define or create a task for event handling only if you are learning and writing a web programming language.

따라서 종래의 웹 레포팅 기술에 의하면, 웹 프로그램을 배우지 않은 관리자들은 위지윅(WYSIWYG) 등을 통해 화면 구성을 할 수 있으나, 이벤트 핸들링의 작업을 정의하여 보다 복잡하고 인터랙티브(interactive) 웹 인터페이스를 만들 수 없다는 문제점이 있다.Therefore, according to the conventional web reporting technology, administrators who have not learned a web program can configure a screen through WYSIWYG, but it is impossible to define a task of event handling to create a more complicated and interactive web interface There is a problem.

한국등록특허 제10-0497811호 (2005.06.18.공고)Korean Registered Patent No. 10-0497811 (published on Jun. 18, 2005)한국등록특허 제10-0697155호 (2007.03.21.공고)Korean Patent No. 10-0697155 (Announcement of Mar. 21, 2007)한국공개특허 제10-2013-0126012호 (2013.11.20.공개)Korean Patent Laid-Open No. 10-2013-0126012 (published on November 20, 2013)

본 발명의 목적은 상술한 바와 같은 문제점을 해결하기 위한 것으로, 위지윅(WYSIWYG) 방식과 드래그앤드롭(Drag & Drop) 방식으로, 컨트롤 객체들을 배치하여 화면을 구성하고, 컨트롤 객체에 데이터셋을 연결하고, 각 컨트롤 객체의 이벤트에 이벤트 동작을 설정하여, 웹 페이지를 구성하는, 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템을 제공하는 것이다.SUMMARY OF THE INVENTION An object of the present invention is to solve the problems described above, and it is an object of the present invention to provide a method and apparatus for providing control objects by arranging control objects in a WYSIWYG method and a drag and drop method, And configures an event operation for an event of each control object to configure a web page.

또한, 본 발명의 목적은 컨트롤 객체의 이벤트에 대한 이벤트 동작을 그래픽 인터페이스를 통해 작성하되, 이벤트 동작을 다수의 단위 동작들의 상하 순서에 의해 배치하고, 단위 동작이 조건문인 경우 각 조건에 따른 동작을 하위 계층으로 갖는 계층구조로 구성하는, 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템을 제공하는 것이다.It is another object of the present invention to create an event operation for an event of a control object through a graphical interface, arrange an event operation in a vertical sequence of a plurality of unit operations, and, if the unit operation is a conditional statement, And a lower layer hierarchical structure.

상기 목적을 달성하기 위해 본 발명은 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 관한 것으로서, 다수의 컨트롤 객체를 배치하고 배치된 컨트롤 객체의 속성을 설정하여 웹 레포팅 페이지의 화면을 편집하는 화면 편집부; 상기 웹 레포팅 페이지 내의 컨트롤 객체에 데이터셋을 연결하는 데이터 연결부; 상기 웹 레포팅 페이지 내의 컨트롤 객체에 이벤트 동작을 설정하는 동작 설정부; 및, 상기 웹 레포팅 페이지의 편집 결과를 반영하여, 편집결과를 웹레포팅 문서로서 작성하여 생성하는 문서 생성부를 포함하는 것을 특징으로 한다.According to an aspect of the present invention, there is provided a graphic reporting system based on a graphical interface, comprising: a screen editing unit for editing a screen of a web reporting page by arranging a plurality of control objects and setting properties of the arranged control objects; A data connection unit for connecting a data set to a control object in the web reporting page; An operation setting unit for setting an event operation to a control object in the web reporting page; And a document generation unit for generating the editing result as a web reporting document by reflecting the editing result of the web reporting page.

또, 본 발명은 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 있어서, 상기 동작 설정부는 상기 컨트롤 객체의 이벤트를 선택하고, 선택된 해당 이벤트에 대한 이벤트 동작을 설정하되, 상기 이벤트 동작은 다수의 단위 동작들의 상하 순서에 의해 배치하여 작성되고, 단위 동작이 조건문인 경우 각 조건에 따른 하위 동작을 하위 계층으로 구성하여 작성되는 것을 특징으로 한다.According to another aspect of the present invention, there is provided a web-based reporting design system based on a graphical interface, wherein the operation setting unit selects an event of the control object and sets an event operation for the selected event, And when a unit operation is a conditional statement, a lower level operation according to each condition is formed as a lower level.

또, 본 발명은 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 있어서, 상기 동작 설정부는 상기 하위 동작은 상하 순서에 의해 배치되는 다수의 단위 동작들로 구성될 수 있고, 상기 하위 동작은 조건문의 단위 동작을 포함할 수 있고, 상기 하위 동작의 조건문의 단위 동작은 각 조건에 따른 동작들이 하위 계층으로 작성되는 것을 특징으로 한다.In addition, the present invention can be applied to a graphical interface-based web reporting design system, wherein the operation setting unit may include a plurality of unit operations arranged in a top-bottom order, And the unit operation of the conditional inquiry of the lower operation is characterized in that operations according to each condition are created in a lower hierarchy.

또, 본 발명은 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 있어서, 상기 동작 설정부는 상하 순서를 갖는 배치 및 계층 구조의 그래픽을 통해서, 계층구조의 이벤트 동작을 위지윅(WYSIWYG) 방식과 드래그앤드롭(Drag & Drop) 방식으로 처리하도록 제공하는 것을 특징으로 한다.According to another aspect of the present invention, there is provided a web-based reporting design system based on a graphical interface, the operation setting unit including a WYSIWYG method and a Drag & Drop method.

또, 본 발명은 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 있어서, 기 동작 설정부는 하나의 단위 동작에는 하나의 실행함수를 선택하게 하고, 선택된 실행함수에 대한 옵션을 설정하게 하는 그래픽 인터페이스를 제공하는 것을 특징으로 한다.According to another aspect of the present invention, there is provided a graphical interface-based web reporting design system, wherein the basic operation setting unit provides a graphical interface for allowing one execution function to be selected for one unit operation and setting an option for the selected execution function .

또, 본 발명은 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 있어서, 상기 동작 설정부는 컨트롤 객체의 종류 또는 이벤트의 종류에 따른 적용가능 실행함수들의 목록을 보유하고, 실행함수들을 목록으로 표시하고 목록 중에서 선택하게 하여 실행함수를 결정하는 것을 특징으로 한다.According to another aspect of the present invention, there is provided a graphical interface-based web reporting design system, wherein the operation setting unit holds a list of applicable execution functions according to a type of a control object or an event, displays execution functions in a list, Thereby determining an execution function.

상술한 바와 같이, 본 발명에 따른 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 의하면, 컨트롤 객체의 화면 배치, 데이터셋 연결, 이벤트 동작 설정 등을 모두 위즈윅 방식과 드래그앤드롭 방식으로 수행함으로써, 프로그래밍 언어을 전혀 알지 못하는 비전문가라도 인터랙티브 웹 레포트 페이지를 작성할 수 있는 효과가 얻어진다.As described above, according to the web-based reporting design system based on the graphic interface of the present invention, the screen layout of the control object, the connection of the data set, and the event operation setting are all performed in the Weizmen method and the drag-and-drop method, Even an unfamiliar expert can obtain an effect of creating an interactive web report page.

또한, 본 발명에 따른 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 의하면, 상하 순서가 있는 배치와 계층구조를 갖는 그래픽 인터페이스에 의하여 이벤트 동작을 프로그래밍 함으로써, 이벤트 동작의 프로그래밍을 직관적으로 작성할 수 있어 프로그래밍의 비전문가라도 손쉽게 동작의 플로우를 제어할 수 있는 효과가 얻어진다.In addition, according to the web-based reporting design system based on the graphical interface according to the present invention, it is possible to intuitively create programming of an event operation by programming an event operation by a hierarchical structure and a hierarchical layout, An effect of easily controlling the flow of operation can be obtained.

도 1은 본 발명을 실시하기 위한 전체 시스템에 대한 구성도.
도 2는 본 발명의 일실시예에 따른 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템의 구성에 대한 블록도.
도 3은 본 발명의 일실시예에 따른 웹 레포팅 페이지의 편집 화면의 예시도.
도 4는 본 발명의 일실시예에 따른 데이터셋을 컨트롤 객체에 연결하는 화면의 예시도.
도 5는 본 발명의 일실시예에 따른 컨트롤 객체의 종류와, 이벤트를 나타낸 표.
도 6 및 도 7은 본 발명의 일실시예에 따른 동작설정 화면의 예시도.
도 8은 본 발명의 일실시예에 따른 실행함수를 등록하는 화면의 예시도.
도 9는 본 발명의 일실시예에 따른 단위동작의 배치 순서를 변경하는 화면의 예시도.
도 10은 본 발명의 일실시예에 따른 조건문의 단위동작을 설정하는 화면의 예시도.
도 11은 본 발명의 일실시예에 따라, 이벤트가 발생될 경우의 설정된 동작이 수행되는 과정을 도시한 흐름도.BRIEF DESCRIPTION OF THE DRAWINGS FIG. 1 is a block diagram of an entire system for implementing the present invention. FIG.
2 is a block diagram of a configuration of a web reporting design system based on a graphical interface according to an embodiment of the present invention;
3 is an illustration of an editing screen of a web reporting page according to an embodiment of the present invention;
4 is a diagram illustrating an example of a screen for connecting a data set to a control object according to an embodiment of the present invention;
5 is a table showing types of control objects and events according to an embodiment of the present invention.
6 and 7 are exemplary views of an operation setting screen according to an embodiment of the present invention;
8 is an exemplary view of a screen for registering an execution function according to an embodiment of the present invention;
9 is an exemplary view of a screen for changing the arrangement order of unit operations according to an embodiment of the present invention;
10 is an exemplary view of a screen for setting a unit operation of a condition inquiry according to an embodiment of the present invention;
11 is a flowchart illustrating a process in which a set operation is performed when an event is generated according to an embodiment of the present invention.

이하, 본 발명의 실시를 위한 구체적인 내용을 도면에 따라서 설명한다.DETAILED DESCRIPTION OF THE PREFERRED EMBODIMENTS Hereinafter, the present invention will be described in detail with reference to the drawings.

또한, 본 발명을 설명하는데 있어서 동일 부분은 동일 부호를 붙이고, 그 반복 설명은 생략한다.In the description of the present invention, the same parts are denoted by the same reference numerals, and repetitive description thereof will be omitted.

먼저, 본 발명을 실시하기 위한 전체 시스템의 구성을 도 1을 참조하여 설명한다.First, a configuration of an overall system for carrying out the present invention will be described with reference to FIG.

도 1에서 보는 바와 같이, 본 발명을 실시하기 위한 전체 시스템은 개발자 단말(10)에 설치되는 클라이언트(20), 클라이언트(20)와 네트워크로 연결되는 웹디자인 서버(30), 및 데이터를 저장하고 관리하는 데이터베이스(40)로 구성된다. 또한, 웹레포팅 자료를 웹 상으로 열람하는 사용자 단말(50), 웹레포팅 자료를 웹 상에서 웹페이지 형태로 제공하는 웹레포팅 서버(60)를 더 포함하여 구성된다.1, the overall system for implementing the present invention includes aclient 20 installed in thedeveloper terminal 10, aweb design server 30 connected to theclient 20 via a network, And adatabase 40 that manages data. Theuser terminal 50 also includes aweb reporting server 60 that provides web reporting data in the form of a web page on the web.

클라이언트(20)는 개발자 단말(10)에 설치되는 클라이언트용 프로그램 시스템으로서, 웹브라우저를 통해 사용자 인터페이스를 갖는다. 즉, 사용자는 웹브라우저 또는 웹브라우저와 같은 화면의 인터페이스를 통해, 온라인상으로 웹 레포팅 페이지(또는 웹페이지)를 디자인 하는 작업을 수행한다. 이때, 개발자 단말(10)은 사용자의 명령 등을 입력받아 해당 명령을 수행하고, 처리 결과를 화면 상 또는 웹브라우저 상에 표시한다.Theclient 20 is a client program system installed in thedeveloper terminal 10 and has a user interface via a web browser. That is, the user performs a task of designing a web reporting page (or web page) on-line via a screen interface such as a web browser or a web browser. At this time, thedeveloper terminal 10 receives a command of the user, executes the command, and displays the processing result on the screen or the web browser.

한편, 개발자 단말(10)은 개발자가 사용하는 단말로서, 개인용 컴퓨터(PC), 노트북, 태블릿PC, 패블릿, PDA, 스마트폰 등 컴퓨팅 기능을 가지는 컴퓨터 단말이다. 개발자 단말(10)과 웹디자인 서버(30)는 네트워크로 연결되어, 개발자 단말(10) 상의 클라이언트(20)는 온라인 상으로 웹페이지 디자인 작업을 수행할 수 있다.Meanwhile, thedeveloper terminal 10 is a terminal used by a developer, and is a computer terminal having a computing function such as a personal computer (PC), a notebook, a tablet PC, a tablet, a PDA, and a smartphone. Thedeveloper terminal 10 and theweb design server 30 are connected to each other via a network so that theclient 20 on thedeveloper terminal 10 can perform web page design work on-line.

또한, 클라이언트(20)는 온라인 상으로 웹 레포팅 페이지(또는 웹페이지)의 화면을 구성하거나, 구성된 웹페이지 내의 구성요소의 이벤트를 설정하거나, 해당 이벤트의 이벤트 핸들링의 동작 설정 작업을 수행한다.Also, theclient 20 configures a screen of a web reporting page (or web page) online, sets an event of a component in a configured web page, or performs an operation setting operation of event handling of the event.

웹 레포팅 페이지는 데이터베이스(40)에 저장된 데이터 또는 데이터셋을 필터링하여 추출하거나, 통계분석 등 분석을 수행하여, 그 결과 데이터를 다양한 형태로 표시하는 웹 페이지를 말한다. 또한, 웹 레포팅 페이지는 사용자가 웹페이지 상에서 클릭, 더블클릭 등 제스쳐를 수행하면, 추출이나 분석을 다시 수행하여 표시하거나 결과 데이터를 다른 형태로 표시하는 등 인터랙티브(interactive) 기능을 포함한다.The web reporting page refers to a web page for filtering or extracting data or a data set stored in thedatabase 40, performing analysis such as statistical analysis, and displaying the resultant data in various forms. In addition, the web reporting page includes an interactive function such as performing a gesture such as a click or a double click on a web page, performing an extraction or analysis again, and displaying the result data in a different form.

먼저, 클라이언트(20)는 위지윅(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식으로 웹 레포팅 페이지를 작성한다. 이때, 웹 레포팅 페이지는 버튼, 콤보박스, 표, 차트 등 다수의 컨트롤 객체로 구성된다. 따라서 클라이언트(20)가 웹 레포팅 페이지를 작성한다는 것은, 다수의 컨트롤 객체를 웹페이지의 화면 상에 배치하고 해당 컨트롤 객체에 속성을 부여하는 것을 말한다.First, theclient 20 creates a web reporting page using a WYSIWYG method and a drag & drop method. At this time, the web reporting page is composed of a plurality of control objects such as a button, a combo box, a table, and a chart. Accordingly, theclient 20 creates a web reporting page by placing a plurality of control objects on the screen of a web page and assigning attributes to the corresponding control objects.

또한, 클라이언트(20)는 웹 레포팅 페이지 내의 컨트롤 객체에 데이터셋(데이터베이스에서 추출한 데이터들)을 연결 설정한다. 즉, 웹 레포팅 페이지가 열람될 때, 컨트롤 객체는 연결된 데이터셋을 데이터베이스(40)로부터 가져와서, 설정된 형태로 해당 데이터셋의 추출된 결과나 분석결과를 표시한다.In addition, theclient 20 establishes a connection with a control object in the web reporting page (data extracted from the database). That is, when the web reporting page is viewed, the control object retrieves the associated dataset from thedatabase 40 and displays the extracted or analyzed results of the dataset in the set form.

이때, 컨트롤 객체는 데이터셋과 연결할 수 있는 객체와, 그렇지 않은 객체로 구별할 수 있다.At this time, the control object can distinguish between an object that can be associated with a data set and an object that is not.

또한, 클라이언트(20)는 웹 레포팅 페이지 내의 컨트롤 객체에, 참조할 데이터셋을 정의하여 연결한다.In addition, theclient 20 defines and connects a control object in the web reporting page with a dataset to be referred to.

데이터셋이란 동일한 필드들로 구성되는 다수의 레코드들로 구성되는 데이터들의 집합을 의미한다. 즉, 하나의 레코드는 다수의 필드값으로 구성되는데, 모든 레코드의 필드(컬럼)는 동일한 필드(또는 컬럼)를 갖는다. 특히, 데이터셋은 하나 또는 다수의 데이터 테이블(또는 데이터베이스의 DB 테이블)로부터 가져온 데이터들이다. 이때, 데이터셋은 하나 또는 다수의 데이터 테이블을 참조하는 쿼리문에 의해 추출된 데이터들이다.A data set refers to a set of data consisting of a plurality of records composed of the same fields. That is, one record is composed of a plurality of field values, and the fields (columns) of all records have the same field (or column). In particular, a dataset is data from one or more data tables (or database tables in a database). At this time, a data set is data extracted by a query statement referring to one or a plurality of data tables.

바람직하게는, 클라이언트(20)는 데이터베이스(40)에서 데이터셋을 참조하는 쿼리문을 작성하기 위하여, 위지윅(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식의 쿼리문 작성 수단을 제공한다. 즉, 클라이언트(20)는 위지위(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식으로 컨트롤 객체에 데이터셋 연결을 정의할 수 있다.Preferably, theclient 20 provides WYSIWYG and drag and drop query statement writing means for creating a query statement referring to the data set in thedatabase 40. [ That is, theclient 20 can define a data set connection to a control object in a WYSIWYG manner and a Drag & Drop manner.

또한, 클라이언트(20)는 컨트롤 객체에 이벤트를 연결하고 해당 이벤트의 동작(이벤트 핸들링)을 설정한다.In addition, theclient 20 connects an event to a control object and sets an operation (event handling) of the event.

이벤트란 웹 레포팅 페이지 상에서 발생하는 동작이나 사건으로서, 키보드에 의한 키 입력, 마우스의 클릭이나 더블 클릭 등 제스쳐, 타이머 기능 발생, 컨트롤 객체의 속성 값 변경 등을 말한다.An event is an action or an event that occurs on a web reporting page, such as a key input by a keyboard, a gesture such as a mouse click or a double click, a timer function, and a property change of a control object.

컨트롤 객체에서 특정 이벤트를 연결하고 해당 이벤트를 처리하는 동작(또는 이벤트 동작)을 설정하면, 해당 이벤트가 발생될 경우 해당 이벤트 동작이 수행된다. 이때, 이벤트가 발생되면 해당 이벤트를 처리하는 것을 이벤트 핸들링이라 한다.When a specific object is connected to a control object and a corresponding event (or event) is set, the corresponding event is performed when the corresponding event occurs. At this time, when an event occurs, processing of the event is called event handling.

클라이언트(20)는 이벤트 동작을 그래픽 인터페이스를 통해 작성한다. 즉, 이벤트 동작은 다수의 단위 동작들의 상하 순서에 의해 배치하여 작성되고, 단위 동작이 조건문인 경우 각 조건에 따른 동작을 하위 계층으로 구성하여 작성된다. 또한, 각 조건에 따른 하위 동작은 다수의 단위 동작들의 상하 순위에 의한 배치로 작성된다. 그리고 이벤트 동작은 각 단위 동작들이 배치 순서에 의하여 순차적으로 수행되도록 제어된다. 또한, 조건문인 단위 동작은 조건에 맞는 하위 계층의 동작이 수행되도록 제어된다.Theclient 20 creates an event operation through a graphical interface. That is, the event operation is created by arranging a plurality of unit operations in the order of up and down, and in the case where the unit operation is a conditional statement, the operation according to each condition is formed as a lower hierarchy. In addition, the lower operation according to each condition is created by the arrangement of the upper and lower orders of the plurality of unit operations. The event operation is controlled such that each unit operation is sequentially performed in the order of arrangement. In addition, the unit operation, which is a conditional statement, is controlled so that the operation of the lower layer conforming to the condition is performed.

또한, 클라이언트(20)는 상하 순서를 갖는 배치 및 계층 구조의 그래픽을 통해서, 계층구조의 이벤트 동작을 위지윅(WYSIWYG) 방식과 드래그앤드롭(Drag & Drop) 방식으로 처리하도록 제공한다.In addition, theclient 20 provides a hierarchical structure for processing an event operation in a WYSIWYG method and a drag & drop method through hierarchical and hierarchical graphics.

또한, 클라이언트(20)는 단위 동작을 정의할 때, 단위 동작에서 수행될 실행함수를 선택하고, 필요한 경우 실행함수에 대한 인자(argument)들을 입력한다.Further, when defining the unit operation, theclient 20 selects the execution function to be performed in the unit operation, and inputs arguments for the execution function, if necessary.

다음으로, 웹디자인 서버(30)는 클라이언트(20)가 웹 상에서 웹 레포팅 페이지를 디자인할 수 있는 서비스를 제공한다. 즉, 웹디자인 서버(30)는 온라인 상으로 웹 레포팅 페이지(또는 웹페이지)의 화면을 구성하거나, 구성된 웹페이지 내의 구성요소의 이벤트를 설정하거나, 해당 이벤트의 이벤트 핸들링의 동작 설정 작업을 수행하도록, 웹 레포팅 페이지의 디자인 서비스를 제공한다.Next, theweb design server 30 provides a service for theclient 20 to design a web reporting page on the web. That is, theweb design server 30 configures the screen of the web reporting page (or web page) online, sets the event of the component in the configured web page, or performs the operation setting operation of the event handling of the corresponding event , And web reporting page design services.

먼저, 웹디자인 서버(30)는 클라이언트(20)에서 웹페이지의 화면을 디자인할 때 사용할 수 있는 컨트롤 객체들의 종류와 모양, 해당 컨트롤 객체에서 사용할 수 있는 속성 등을 사전에 정의해둔다.First, theweb design server 30 defines the types and shapes of control objects that can be used when designing a screen of a web page in theclient 20, and attributes that can be used in the corresponding control objects.

또한, 웹디자인 서버(30)는 데이터베이스(40)에 접속하여, DB테이블의 목록 및, 해당 DB테이블의 필드들의 명칭, 타입 등 DB테이블의 메타 정보를 가져와서, 클라이언트(20)에서 데이터셋을 정의하기 위한 쿼리문의 정보로서 제공한다. 또한, 웹디자인 서버(30)는 데이터셋을 정의하기 위해 이미 템플릿으로 만들어 놓은 쿼리문을 제공할 수 있다.Theweb design server 30 also accesses thedatabase 40 to obtain meta information of a DB table such as a list of DB tables and names and types of fields of the DB tables, It is provided as query inquiry information to be defined. In addition, theweb design server 30 can provide a query statement that has already been made into a template to define a data set.

또한, 웹디자인 서버(30)는 클라이언트(20)에서 사용할 수 있는 전체 이벤트들, 각 컨트롤 객체에서 사용할 수 있는 이벤트들 등을 사전에 설정해두고, 클라이언트(20)에서 이벤트를 설정할 때, 이벤트들의 목록을 제공한다.In addition, theweb design server 30 sets all events available in theclient 20, events that can be used in each control object, and the like, and when the event is set in theclient 20, .

또한, 웹디자인 서버(30)는 클라이언트(20)에서 단위 동작으로 사용할 수 있는 실행 함수들을 사전에 정의하여 설정해둔다. 또한, 실행함수들의 이름 및, 인자 등 실행함수의 메타정보를 클라이언트(20)에 전달할 수 있다. 이때, 실행함수들은 자바, 비주얼베이직 등 웹 프로그래밍 언어 또는 일반 프로그래밍 언어로 작성된 함수일 수 있다.In addition, theweb design server 30 defines and sets execution functions that can be used by theclient 20 in a unit operation in advance. In addition, the name of the execution function, meta information of an execution function such as an argument, and the like can be transmitted to theclient 20. At this time, the execution functions may be functions written in a web programming language such as Java, Visual Basic, or a general programming language.

또한, 웹디자인 서버(30)는 클라이언트(20)에서 상하순서에 의한 배치 및 계층구조로 작성된 이벤트 동작을 자바, 비주얼베이직 등 웹 프로그래밍 언어 또는 일반 프로그래밍 언어로 변환하여 스크립트 코드로 변환한다.In addition, theweb design server 30 converts the events generated in the hierarchical structure and the hierarchical structure in theclient 20 into a web programming language or a general programming language such as Java or VB, and converts them into script codes.

또한, 웹디자인 서버(30)는 클라이언트(20)에서 웹 레포팅 페이지의 디자인 편집이 완료되면, 웹 레포팅 페이지에서 정의된 컨트롤 객체들과, 이벤트, 이벤트 동작들을 웹 표준 언어에 의한 웹 페이지 및, 웹 스크립트 언어 등으로 변환하여, 최종적인 웹 레포팅 페이지를 생성한다.In addition, when the design of the web reporting page is completed in theclient 20, theweb design server 30 transmits control objects defined in the web reporting page, events and event operations to web pages based on the web standard language, Script language, etc. to generate the final web reporting page.

또한, 다른 실시예로서, 웹디자인 서버(30)는 웹 레포팅 페이지의 디자인 편집이 완료되면, 웹 레포팅 페이지에서 정의된 컨트롤 객체들과, 이벤트, 이벤트 동작들에 대한 편집 정보를 XML 등의 규격화된 형태로 저장한다. 예를 들어, 컨트롤 객체들에 대한 편집 정보는, 각 컨트롤 객체의 종류, 속성들, 이벤트, 해당 이벤트 동작 정보 등으로 구성된다.이를 웹레포팅 문서라 부르기로 한다.In addition, as another embodiment, when the design of the web reporting page is completed, theweb designing server 30 transmits the editing information about the control objects defined in the web reporting page and the event and event operations to the standardized . For example, the editing information for the control objects consists of the type of each control object, the properties, the event, the corresponding event operation information, and so on.

그리고 전용 뷰어에 의하여, 해당 규격화된 형태의 웹 레포팅 문서를 읽어서, 웹 레포팅 페이지를 생성하여 웹 상에서 표시되고 동작될 수 있다.Then, by reading the web reporting document of the standardized form by a dedicated viewer, a web reporting page can be generated and displayed and operated on the web.

한편, 앞서 설명한 클라이언트(20)와 웹디자인 서버(30)의 기능은 일례이고, 서버와 클라이언트의 구현 기술에 따라 다양하게 구현될 수 있다. 즉, 클라이언트(20)와 웹디자인 서버(30)은 하나의 웹 레포팅 디자인 시스템으로서, 그 기능들이 성능에 따라 서로 분배될 수 있다. 예를 들어, 클라이언트(20)는 단순히 웹브라우저 기능만 가지고 있고, 모든 기능은 웹디자인 서버(30)에서 구축될 수 있다. 즉, 웹디자인 서버(30)은 웹 화면 디자인, 데이터셋 연결, 이벤트 설정 등의 기능을 모두 가질 수 있다. 또 다른 예로서, 웹디자인 서버(30)는 데이터베이스(40)와의 인터페이스 기능이나 최종 레포팅 페이지를 등록하는 기능만 가지고 있고, 클라이언트(20)에서 웹 화면 디자인, 데이터셋 연결, 이벤트 설정 등의 기능 뿐만 아니라, 편집된 레포팅 페이지에서 최종 웹 레포팅 페이지를 변환하는 기능까지 구비될 수 있다. 즉, 서버-클라이언트 구현 방식에 의해 다양한 형태로 기능을 분배할 수 있다.Meanwhile, the functions of theclient 20 and theweb design server 30 are merely exemplary and may be implemented variously according to the implementation techniques of the server and the client. That is, theclient 20 and theweb design server 30 are one web reporting design system, and their functions can be distributed to each other according to their performance. For example, theclient 20 has merely a web browser function, and all the functions can be built in theweb design server 30. That is, theweb design server 30 can have functions of web screen design, data set connection, event setting, and the like. As another example, theweb design server 30 only has a function of registering a function of interfacing with thedatabase 40 or a final reporting page. In addition, theweb design server 30 has functions such as web screen design, dataset connection, But also the ability to convert the final web reporting page from the edited reporting page. That is, the functions can be distributed in various forms according to the server-client implementation method.

바람직하게는, 클라이언트(20)는 어플리케이션 기능을 갖는 웹 표준(예를 들어, HTML5 등)과 웹 스크립트 언어(예를 들어, 자바 등)에 의해 구현된다. 그리고, 클라이언(20)와 웹 디자인 서버(30) 간의 데이터 송수신은 웹브라우저와 웹 서버 간의 표준적인 통신 프로토콜에 의해 수행된다. 예를 들어, 웹브라이저와 웹서버의 비동기적인 통신 프로토콜인 AJAX(Asynchronous Javascript And Xml)를 사용하거나, 웹서버와의 데이터 교환 형식인 JSON(JavaScript Object Notation) 등을 이용하여, 클라이언트(20)와 웹 디자인 서버(30) 간에 데이터를 교환한다.Preferably, theclient 20 is implemented by a web standard (e.g., HTML5, etc.) having an application function and a web script language (e.g., Java, etc.). Data transmission / reception between theclient 20 and theweb design server 30 is performed by a standard communication protocol between the web browser and the web server. For example, using the asynchronous communication protocol AJAX (Asynchronous Javascript And Xml) of the web browser and the web server, or using JSON (JavaScript Object Notation) as a data exchange format with the web server, And theweb design server 30.

즉, 클라이언트(20)는 SPA(Single Page Application)으로 구성된다. SPA는 최초에 웹 애플리케이션에 필요한 리소스를 다운받고, 이후에 데이터가 변경되면 변경된 데이터를 전달 받아서 페이지를 갱신한다.That is, theclient 20 is configured as a single page application (SPA). The SPA first downloads the resources required for the web application, and then updates the page after receiving the changed data when the data is changed.

특히, 클라이언트(30)는 HTML5과 자바(java) 스크립트로 구현되어, 컨트롤 객체 등의 화면 배치 디자인은 HTML5에 의해 수행되고, 각 컨트롤 객체의 이벤트 및 속성(색상, 사이즈 등)들은 자바(java) 스크립트로 구현된다.In particular, theclient 30 is implemented with HTML5 and Java script, and the screen layout design of the control object and the like is performed by HTML5, and the events and attributes (color, size, etc.) It is implemented as a script.

또한, 편집상태의 웹 페이지(편집용 클라이언트) 또는 최종실행하는 웹 페이지(뷰어용 클라이언트)는 동적 웹 페이지(Dynamic Page)를 사용하여, 개발자 또는 사용자가 클라이언트에서 원하는 정보를 요청하면, 서버에서 데이터베이스 연동이나 클라이언트가 원하는 작업을 대신 처리하고 그 결과를 클라이언트에서 전달한다. 이때, 작업 요청나 작업 결과의 송수신은 AJAX, 또는 JSON 등의 표준 데이터 교환 방식을 사용한다.When a developer or a user requests information desired by a client using a dynamic web page (dynamic page), a web page (client for editing) in the edited state or a web page (client for viewer) It handles the interworking or the client's desired work and delivers the result to the client. At this time, a standard data exchange method such as AJAX or JSON is used for sending and receiving a work request or a work result.

다음으로, 데이터베이스(40)는 데이터를 저장하기 위한 통상의 데이터베이스(DB)로서, 데이터를 관리하기 위한 DBMS를 구비하고, 데이터의 저장, 삭제, 검색 등의 작업들을 쿼리(또는 쿼리문)를 통해 수행한다. 특히, 데이터베이스(40)는 상용화된 데이터베이스로서, 데이터셋을 처리하기 위한 일반적인 쿼리 기능을 이용하여, 데이터 쿼리 서비스를 수행한다.Next, thedatabase 40 is a normal database (DB) for storing data, and is provided with a DBMS for managing data, and the operations such as data storage, deletion, and retrieval are transmitted through a query . In particular, thedatabase 40 is a commercially available database, and performs a data query service using a general query function for processing a data set.

특히, 데이터베이스(40)는 빅데이터를 저장하는 데이터베이스이다. 또한, 바람직하게는, 데이터베이스(40)는 관계형 데이터베이스(RDB)로 구성된다.In particular, thedatabase 40 is a database for storing big data. Also, preferably, thedatabase 40 comprises a relational database (RDB).

또한, 데이터베이스(40)는 웹 디자인 서버(30)에 직접 연결된 데이터베이스로 구현될 수도 있고, 인터넷 상에서 독립된 DB 서버로서 구현될 수 있다.In addition, thedatabase 40 may be implemented as a database directly connected to theweb design server 30, or may be implemented as an independent DB server on the Internet.

다음으로, 웹 레포팅 서버(60)는 웹 레포팅 서비스를 제공하는 통상의 웹 서비스 서버이다. 즉, 웹 레포팅 서버(60)는 웹 디자인 서버(30)에서 완성된 웹 레포팅 페이지를 등록하고, 사용자 단말(50)에서 요청될 때 해당 웹 레포팅 페이지를 제공하는 서비스를 제공한다.Next, theweb reporting server 60 is a conventional web service server that provides a web reporting service. That is, theweb reporting server 60 registers the completed web reporting page in theweb designing server 30 and provides a service for providing the corresponding web reporting page when requested by theuser terminal 50.

또한, 사용자 단말(50)은 사용자가 사용하는 단말로서, 개인용 컴퓨터(PC), 노트북, 태블릿PC, 패블릿, PDA, 스마트폰 등 컴퓨팅 기능을 가지는 컴퓨터 단말이다. 사용자 단말(50)과 웹 레포팅 서버(60)는 네트워크로 연결되어, 사용자 단말(50) 상의 웹브라우저를 통해, 웹 레포팅 페이지를 열람한다.Theuser terminal 50 is a terminal used by a user, and is a computer terminal having a computing function such as a personal computer (PC), a notebook, a tablet PC, a tablet, a PDA, or a smartphone. Theuser terminal 50 and theweb reporting server 60 are connected via a network to browse the web reporting page through a web browser on theuser terminal 50.

사용자 단말(50)은 웹브라우저가 설치되어, 웹 상에서 웹 레포팅 페이지를 열람할 수 있다.Theuser terminal 50 is provided with a web browser, and can browse the web reporting page on the web.

일실시예에 의하면, 웹레포팅 문서가 편집 내용이 규격화된 형태로 저장된다. 그리고 사용자 단말(50)의 웹브라우저에서 웹레포팅 서버(60)에 접속하면, 웹브라우저는 웹레포팅 문서를 열람할 수 있는 웹레포팅 뷰어를 가져온다. 그리고 웹레포팅 뷰어는 웹레포팅 문서의 편집결과를 해석하여, 웹레포팅 페이지 또는 웹페이지를 생성하여 표시한다.According to one embodiment, the web reporting document is stored in a format in which edited contents are standardized. When the web browser of theuser terminal 50 accesses theweb reporting server 60, the web browser fetches a web reporting viewer which can browse the web reporting document. The web reporting viewer interprets the editing result of the web reporting document and generates and displays the web reporting page or the web page.

즉, 사용자는 웹브라우저를 통해 웹레포팅 뷰어를 통해 웹 레포팅 페이지를 열기 함으로써, 웹 레포팅 페이지에서 제공하는 데이터셋의 추출이나 분석 결과를 열람할 수 있다. 이때, 웹 레포팅 페이지 상에서 클릭, 더블 클릭 등 마우스의 제스쳐나 키보드의 입력키에 의해 인터랙티브(interactive) 방식으로 추출 또는 분석결과를 다양한 형태로 열람할 수 있다.That is, the user can open the web reporting page through the web reporting viewer through the web browser, and can view the data set extracted or analyzed from the web reporting page. At this time, an extraction or analysis result can be browsed in various forms in an interactive manner by a mouse gesture such as a click or a double click on the web reporting page or an input key of a keyboard.

또한, 사용자 단말(50)이 웹 레포팅 페이지에서 데이터셋을 참조하면, 웹 레포팅 서버(60)는 데이터베이스(40)를 참조하여 데이터셋을 가져와서 해당 데이터셋을 해당 웹 레포팅 페이지에 표시한다.In addition, when theuser terminal 50 refers to the data set on the web reporting page, theweb reporting server 60 refers to thedatabase 40 and fetches the data set and displays the data set on the corresponding web reporting page.

다음으로, 본 발명의 일실시예에 따른 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템을 도 2를 참조하여 설명한다. 본 발명에 따른 웹 레포팅 디자인 시스템은 앞서 설명한 바와 같이, 클라이언트-서버 시스템으로 구축될 수 있다.Next, a graphical interface-based web reporting design system according to an embodiment of the present invention will be described with reference to FIG. The web reporting design system according to the present invention can be constructed as a client-server system, as described above.

도 2에서 바와 같이, 본 발명의 일실시예에 따른 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템(300)은 웹 레포팅 페이지의 화면을 편집하는 화면 편집부(31), 화면의 컨트롤 객체에 데이터셋을 연결하는 데이터 연결부(32), 컨트롤 객체의 이벤트 동작을 설정하는 동작 설정부(33), 편집된 레포팅 페이지의 편집 내용을 생성하여 저장하는 문서 생성부(34)로 구성된다. 또한, 처리하는 데이터를 일시적으로 저장하는 저장부(38)를 더 포함하여 구성된다.2, the graphical interface-based web reporting design system 300 according to an exemplary embodiment of the present invention includes ascreen editing unit 31 for editing a screen of a web reporting page, data for connecting a data set to a control object of the screenA connection unit 32, anoperation setting unit 33 for setting an event operation of the control object, and adocument generating unit 34 for generating and storing edited contents of the edited reporting page. In addition, it further comprises astorage unit 38 for temporarily storing data to be processed.

먼저, 화면 편집부(31)는 다수의 컨트롤 객체를 배치하고 배치된 컨트롤 객체의 속성을 설정하여 웹 레포팅 페이지의 화면을 편집한다. 이때, 위지윅(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식으로 웹 레포팅 페이지를 편집한다.First, thescreen editing unit 31 arranges a plurality of control objects and sets the properties of the arranged control objects to edit the screen of the web reporting page. At this time, edit web reporting page by WYSIWYG method and drag & drop method.

컨트롤 객체는 버튼, 콤보박스, 도형, 텍스트 박스, 표, 차트 등 웹 보고서를 표현하기 위한 객체들이다. 특히, 컨트롤 객체는 버튼, 콤보박스, 체크박스, 입력 박스 등 제어를 위한 제어용 객체, 라벨, 이미지 등 레포팅의 내용이나 형식을 표현하기 위한 표시형 객체, 차트, 피벗 그리드, 리스트형 그리드 등 데이터셋과 연결될 수 있는 데이터 객체 등으로 구분될 수 있다.Control objects are objects for representing web reports such as buttons, combo boxes, shapes, text boxes, tables, and charts. In particular, a control object is a control object for controlling a button, a combo box, a check box, an input box, etc., a data object such as a display object, a chart, a pivot grid, and a list grid for expressing the contents or format of a report, And a data object that can be connected to the network.

도 5에서, (a)는 데이터 객체를, (b)는 제어용 객체를, (c)는 표시형 객체를 나타내고 있다.In FIG. 5, (a) represents a data object, (b) represents a control object, and (c) represents a display object.

컨트롤 객체는 하나의 객체로서, 다수의 속성을 가지며, 속성 값을 설정함으로써 객체가 설정된다. 또한, 바람직하게는, 컨트롤 객체는 기본적인 디폴트 값으로 속성이 설정되고, 개발자에 의해 커스터마이징 된다. 객체의 속성을 설정하는 기술은 이미 잘 알려진 기술이므로, 구체적 설명은 생략한다.A control object is an object, has a number of attributes, and the object is set by setting the attribute value. Preferably, the control object is set to a default default value, and is customized by the developer. Since the technique of setting the attribute of the object is a well-known technique, a detailed description thereof will be omitted.

또한, 컨트롤 객체는 다수의 객체들로 구성될 수 있다. 예를 들어, 차트 객체는 그래프, 라벨 등으로 구성될 수 있고, 표(리스트형 그리드)나 피벗 그리드 객체는 다수의 셀, 타이틀 등으로 구성될 수 있다. 이때, 컨트롤 객체를 구성하는 객체들을 소속 객체라 부르기로 한다.In addition, the control object may be composed of a plurality of objects. For example, a chart object can be composed of a graph, a label, and the like. A table (list type grid) or a pivot grid object can be composed of a plurality of cells, titles, and the like. At this time, the objects constituting the control object are referred to as belonging objects.

한편, 화면 편집부(31)는 위지윅(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식으로 웹 레포팅 페이지를 편집하도록, 편집 화면을 제공한다. 웹 레포팅 페이지의 화면을 편집하는 예가 도 3에 도시되고 있다.On the other hand, thescreen editing unit 31 provides an editing screen for editing a web reporting page by a WYSIWYG method and a drag and drop method. An example of editing the screen of the web reporting page is shown in Fig.

도 3에서 보는 바와 같이, 컨트롤 객체를 종류별로 표시하여 선택할 수 있도록 제공하는 객체 창, 편집 대상인 웹 레포팅 페이지를 표시하는 페이지편집 창, 페이지의 컨트롤 객체의 속성을 설정하는 속성 창 등으로 구성된다.As shown in FIG. 3, it is composed of an object window providing a control object to be displayed and selected for each type, a page editing window displaying a web reporting page to be edited, and an attribute window for setting properties of a control object of the page.

즉, 개발자는 객체 창에서 컨트롤 객체를 선택하여, 페이지편집 창에서 해당 컨트롤 객체를 배치하고, 편집 창에서 위치나 크기 등을 디자인 하고, 편집 창에서 컨트롤 객체를 선택한 후 속성 창에서 해당 컨트롤 객체의 속성을 설정한다.In other words, the developer can select the control object from the object window, arrange the control object in the edit page window, design the position and size in the edit window, select the control object in the edit window, Set the attribute.

다음으로, 데이터 연결부(32)는 웹 레포팅 페이지 내의 컨트롤 객체에 데이터셋을 연결하여 설정한다.Next, thedata connection unit 32 connects and sets a data set to the control object in the web reporting page.

앞서 설명한 바와 같이, 데이터셋이란 동일한 필드들로 구성되는 다수의 레코드들로 구성되는 데이터들의 집합으로서, 하나 또는 다수의 DB테이블을 참조하는 쿼리문에 의해 추출되는 데이터들이다.As described above, a data set is a set of data composed of a plurality of records composed of the same fields, and is data extracted by a query statement referring to one or a plurality of DB tables.

한편, 컨트롤 객체에서 데이터셋을 연결하여 설정한다는 것은 실제로 참조하여 가져와서 연결하는 것 뿐만 아니라, 실제 참조하지 않았으나 참조할 데이터셋과 연결하는 것도 포함한다. 따라서 컨트롤 객체에 데이터셋 연결 작업은 참조한 데이터셋을 연결하거나, 참조할 데이터셋을 정의한 쿼리문을 컨트롤 객체에 연결하는 것을 말한다.On the other hand, connecting and setting up a dataset in a control object involves not only actually referring to and connecting to it, but also connecting to a dataset that is not actually referenced but is referred to. Therefore, connecting a dataset to a control object refers to connecting the referenced dataset, or connecting the query statement that defines the dataset to be referenced to the control object.

또한, 데이터 연결부(32)는 데이터베이스(40)에서 데이터셋을 참조하는 쿼리문을 작성하기 위하여, 위지윅(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식의 쿼리문 작성 수단을 제공한다. 또한, 데이터 연결부(32)는 데이터셋을 정의하기 위해 이미 템플릿으로 만들어 놓은 쿼리문을 제공할 수 있다.Thedata connection unit 32 provides a WYSIWYG method and a drag and drop method for generating a query statement to create a query statement referring to the data set in thedatabase 40. [ In addition, thedata connection unit 32 may provide a query statement that has already been made into a template in order to define a data set.

도 4는 컨트롤 객체에 데이터셋을 연결하는 예를 도시하고 있다.Figure 4 shows an example of connecting a dataset to a control object.

도 4에서 보는 바와 같이, 데이터 연결부(32)는 이미 만들어진 쿼리문 템플릿을 선택하여, 해당 템플릿으로 쿼리문을 만들 수 있다. 즉, 위지윅(WYSIWYG) 방식 및 드래그앤드롭(Drag & Drop) 방식으로 손쉽게 쿼리문을 작성할 수 있다.As shown in FIG. 4, thedata connection unit 32 can select a query statement template that has already been created, and create a query statement using the template. In other words, WYSIWYG (WYSIWYG) and drag-and-drop (Drag & Drop) method can easily write queries.

다음으로, 동작 설정부(33)는 웹 레포팅 페이지 내의 컨트롤 객체에 이벤트 동작을 설정한다. 이벤트 동작은 이벤트가 발생되는 경우 실행되는 동작이다.Next, theoperation setting unit 33 sets the event operation to the control object in the web reporting page. An event action is an action that is executed when an event occurs.

이벤트란 웹 레포팅 페이지 상에서 발생하는 동작이나 사건으로서, 키보드에 의한 키 입력, 마우스의 클릭이나 더블 클릭 등 제스쳐, 타이머 기능 발생, 컨트롤 객체의 속성 값 변경 등을 말한다. 또한, 컨트롤 객체가 다수의 객체(또는 소속 객체)로 구성되는 경우, 소속 객체의 이벤트도 컨트롤 객체의 이벤트로 설정될 수 있다.An event is an action or an event that occurs on a web reporting page, such as a key input by a keyboard, a gesture such as a mouse click or a double click, a timer function, and a property change of a control object. Also, when a control object is composed of a plurality of objects (or belonging objects), an event of the belonging object can also be set as an event of the control object.

또한, 이벤트는 컨트롤 객체의 종류에 따라 달라질 수 있다. 도 5는 컨트롤 객체와, 해당 컨트롤 객체에서 사용할 수 있는 이벤트들을 나타내고 있다.Also, the event may vary depending on the type of control object. FIG. 5 shows control objects and events that can be used in the corresponding control objects.

도 5에서 보는 바와 같이, 그리드는 셀 또는 헤더에 클릭(더블클릭) 하는 이벤트를 가질 수 있고, 콤보박스나 입력박스는 값의 변경하는 이벤트를 가질 수 있다. 즉 컨트롤 객체의 종류에 따라 해당 컨트롤 객체가 가질 수 있는 이벤트가 달라질 수 있다.As shown in FIG. 5, the grid may have an event of clicking (double clicking) on a cell or a header, and a combo box or an input box may have an event of changing a value. In other words, depending on the type of control object, the event that the control object can have is different.

동작 설정부(33)는 컨트롤 객체의 이벤트 동작을 설정할 때, 해당 컨트롤 객체의 이벤트를 선택하고, 해당 이벤트에 대한 동작(이벤트 동작)을 설정한다. When setting an event operation of a control object, theoperation setting unit 33 selects an event of the control object and sets an operation (event operation) for the event.

앞서 설명한 바와 같이, 이벤트 동작은 다수의 단위 동작들의 상하 순서에 의해 배치하여 작성되고, 단위 동작이 조건문인 경우 각 조건에 따른 동작을 하위 계층으로 구성하여 작성된다. 또한, 각 조건에 따른 하위 동작은 다수의 단위 동작들의 상하 순위에 의한 배치로 작성된다. 또한, 각 조건에 따른 하위 동작에서 조건문의 단위 동작을 포함할 수 있고, 이 경우에도 하위 조건문의 조건에 따른 동작들이 하위 계층으로 작성된다.As described above, the event operation is created by arranging a plurality of unit operations in the order of up and down, and in the case where the unit operation is a conditional statement, the operation according to each condition is formed as a lower hierarchy. In addition, the lower operation according to each condition is created by the arrangement of the upper and lower orders of the plurality of unit operations. In addition, a unit operation of a conditional statement can be included in a sub-operation according to each condition, and operations corresponding to the condition of the sub-conditional statement are created in a lower hierarchy.

그리고 이벤트 동작은 각 단위 동작들이 배치 순서에 의하여 순차적으로 수행되도록 제어된다. 또한, 조건문인 단위 동작은 조건에 맞는 하위 계층의 동작(또는 하위 동작)이 수행되도록 제어된다.The event operation is controlled such that each unit operation is sequentially performed in the order of arrangement. In addition, the unit operation, which is a conditional statement, is controlled so that the operation (or the sub-operation) of the lower layer corresponding to the condition is performed.

한편, 동작 설정부(33)는 상하 순서를 갖는 배치 및 계층 구조의 그래픽을 통해서, 계층구조의 이벤트 동작을 위지윅(WYSIWYG) 방식과 드래그앤드롭(Drag & Drop) 방식으로 처리하도록 제공한다.On the other hand, theoperation setting unit 33 provides an event operation of a hierarchical structure through a WYSIWYG method and a drag-and-drop method through hierarchical and hierarchical graphics.

컨트롤 객체의 동작을 설정하는 예가 도 6 및 도 7에 도시되고 있다.An example of setting the operation of the control object is shown in Figs. 6 and 7. Fig.

도 6에서 보는 바와 같이, 특정 컨트롤 객체를 선택하여, 해당 컨트롤 객체에 대한 동작을 설정할 수 있다. 이때, 동작 설정을 그래픽 통해 수행할 수 있도록 동작 설정 화면을 표시한다.As shown in FIG. 6, a specific control object can be selected to set an operation for the corresponding control object. At this time, the operation setting screen is displayed so that the operation setting can be graphically performed.

도 7에서 보는 바와 같이, 동작 설정 화면에는 컨트롤 객체를 표시하는 객체 표시창(1번창), 해당 객체의 이벤트를 선택하는 이벤트 선택창(3번창), 이벤트 동작을 그래픽으로 표시하는 이벤트 동작 표시창(4번창), 단위 동작의 실행함수의 옵션 설정창(5번창) 등으로 구성된다.7, the operation setting screen includes an object display window (No. 1 window) for displaying a control object, an event selection window (No. 3 window) for selecting an event of the object, and an event operation display window 4 ), An option setting window of the execution function of the unit operation (the fifth window), and the like.

또한, 도 7의 2번 창과 같이, 실행함수를 모듈화하여, 자주 사용하는 실행함수를 사전에 모듈에 등록하고, 해당 모듈에 등록된 실행함수를 단위 동작으로 설정할 수 있다.7, the execution function is modularized, a frequently used execution function is registered in advance in the module, and the execution function registered in the module can be set as a unit operation.

도 7의 4번 창에서 보는 바와 같이, 이벤트 동작은 상하 순위를 갖는 다수의 단위 동작으로 구성되고, 단위 동작이 조건문(예를 들어, if문 등)은 계층구조를 갖고, 각 조건에 따른 동작을 하위 계층으로 구성하여 작성된다.As shown in the fourth window in Fig. 7, the event operation is constituted by a plurality of unit operations having the top and bottom rankings, and the unit operation has a hierarchical structure of conditional statements (e.g., if statements, etc.) As a lower layer.

또한, 동작 설정부(33)는 하나의 단위 동작에는 하나의 실행함수를 선택하고, 선택된 실행함수에 대한 인자(argument)(또는 옵션, 실행옵션)를 설정한다.In addition, theoperation setting unit 33 selects one execution function for one unit operation and sets an argument (or option, execution option) for the selected execution function.

이때, 동작 설정부(33)는 컨트롤 객체의 종류(또는 이벤트의 종류)에 따른 적용가능 실행함수들의 목록을 보유하고, 실행함수의 목록을 개발자에게 표시하고 목록 중에서 실행함수를 선택하게 하여 실행함수를 결정한다.At this time, theoperation setting unit 33 holds a list of applicable execution functions according to the type of the control object (or the type of event), displays a list of execution functions to the developer, selects an execution function from the list, .

또한, 각 실행함수는 사전에 정의되고, 각 실행함수의 옵션도 사전에 정의된다. 따라서 특정 실행함수가 선택되면, 해당 실행함수의 옵션을 옵션 설정창에 표시한다. 실행함수의 옵션은 실행함수의 인수나 환경 변수 등 상세한 기능을 설정하기 위한 변수들이다.In addition, each execution function is defined in advance, and the options of each execution function are also defined in advance. Therefore, when a specific execution function is selected, the option of the execution function is displayed in the option setting window. The options of the executable function are variables for setting detailed functions such as arguments and environment variables of the executable function.

도 8은 실행함수를 추가하는 화면의 일례를 도시한 것이다.Fig. 8 shows an example of a screen for adding an execution function.

도 8에서 보는 바와 같이, 동작 설정부(33)는 그래픽 인터페이스를 통해 각 단위 동작에 실행함수를 설정하여 등록할 수 있다.As shown in FIG. 8, theoperation setting unit 33 can set and execute an execution function for each unit operation through a graphical interface.

한편, 앞서 설명한 바와 같이, 동작 설정부(33)는 이벤트 동작을 배치순서를 갖는 다수의 단위 동작으로 설정하는데, 이때, 상하 배치 순서에 의하여 각 단위 동작의 실행순서가 정해진다.On the other hand, as described above, theoperation setting unit 33 sets the event operation to a plurality of unit operations having the arrangement order. At this time, the execution order of each unit operation is determined by the up-and-down arrangement order.

도 9은 이벤트 동작에서 단위 동작들이 배치된 순서에 의하여 실행 순서를 설정하는 예를 도시하고 있다. 도 9에서 보는 바와 같이, 이벤트 동작 창에서 드래그앤드롭(Drag & Drop) 방식으로 각 단위동작(또는 실행함수)의 순서를 변경함으로써, 실행 순서를 변경할 수 있다.FIG. 9 shows an example of setting an execution order by the order in which the unit operations are arranged in the event operation. As shown in FIG. 9, the execution order can be changed by changing the order of each unit operation (or execution function) in a drag & drop manner in the event operation window.

또한, 도 10는 단위 동작이 조건문(또는 조건문의 실행함수)으로 구성되는 경우를 나타내고 있다.10 shows a case where the unit operation is constituted by a conditional statement (or an execution function of a conditional inquiry).

도 10와 같이, 조건문의 실행함수(또는 조건문의 단위 동작)는 각 조건에 따라 수행될 하위 동작이 계층 구조로 표시된다. 이때 하위 동작은 상하 순서를 갖는 다수의 단위 동작들로 구성될 수 있다.As shown in Fig. 10, a sub-action to be performed according to each condition is displayed in a hierarchical structure in the execution function of the condition inquiry (or the unit operation of the condition inquiry). At this time, the lower operation may be composed of a plurality of unit operations having the up-down order.

또한, 도 10에서 보는 바와 같이, 조건문을 작성하기 위한 편집 수단으로서, 그래픽 인터페이스를 통해 위지윅(WYSIWYG) 방식 또는 드래그앤드롭(Drag & Drop) 방식의 편집 수단을 제공한다.Also, as shown in FIG. 10, editing means for creating a conditional statement is provided with a WYSIWYG method or a drag and drop method through a graphic interface.

다음으로, 문서 생성부(34)는 웹 레포팅 페이지의 편집 결과를 웹레포팅 문서에 저장한다.Next, thedocument generation unit 34 stores the editing result of the web reporting page in the web reporting document.

일실시예로서, 웹레포팅 문서는 편집된 웹레포팅 페이지의 편집 내용을 저장한다. 바람직하게는, XML 등 마크업 언어로 저장한다. 즉, 웹레포팅 문서에는 웹 레포팅 페이지에서 정의된 컨트롤 객체들과, 이벤트, 이벤트 동작들에 대한 편집 정보를 XML 등의 규격화된 형태로 저장한다. 예를 들어, 컨트롤 객체들에 대한 편집 정보는, 각 컨트롤 객체의 종류, 속성들, 이벤트, 해당 이벤트 동작 정보 등으로 구성된다.In one embodiment, the web reporting document stores the edited contents of the edited web reporting page. Preferably, it is stored in a markup language such as XML. That is, the web reporting document stores the control objects defined in the web reporting page, and editing information on events and event operations in a standardized form such as XML. For example, the editing information for the control objects includes the type of each control object, the attributes, the event, and the corresponding event operation information.

다른 실시예로서, 웹레포팅 문서는 편집된 웹레포팅 페이지의 편집 내용을 반영하여, 실제 웹 페이지를 작성하여 생성할 수 있다. 즉, 웹레포팅 페이지 내의 각 컨트롤 객체들은 웹 표준에 의한 웹페이지로 생성되고, 각 컨트롤 객체의 이벤트 및 이벤트 동작은 웹 표준에 의한 웹 스크립트 언어에 의해 작성된다. 이때, 작성된 웹 스크립트도 웹페이지 내에 포함되어 생성된다.In another embodiment, the web reporting document may be created by creating an actual web page reflecting the edited content of the edited web reporting page. That is, each control object in the web reporting page is created as a web page based on the web standard, and event and event operations of each control object are created by the web script language according to the web standard. At this time, the created web script is also included in the web page.

즉, 앞서 웹 레포팅 페이지를 편집하는 구성요소들, 즉, 화면 편집부(31), 데이터 연결부(32), 및, 동작 설정부(33)에서 설정한 편집 결과들을 반영하여, 웹 표준에 따른 웹 페이지를 생성한다.That is, by reflecting the editing results set by the components for editing the web reporting page, that is, thescreen editing unit 31, thedata connection unit 32, and theoperation setting unit 33, .

도 11은 이벤트가 발생될 경우, 설정된 동작이 수행되는 과정을 나타낸다. 이러한 과정에 따라 편집 결과를 웹 표준에 따른 웹페이지로 생성한다.11 shows a process in which an established operation is performed when an event is generated. According to this process, the editing result is created as a web page according to the web standard.

이상, 본 발명자에 의해서 이루어진 발명을 상기 실시 예에 따라 구체적으로 설명하였지만, 본 발명은 상기 실시 예에 한정되는 것은 아니고, 그 요지를 이탈하지 않는 범위에서 여러 가지로 변경 가능한 것은 물론이다.Although the present invention has been described in detail with reference to the above embodiments, it is needless to say that the present invention is not limited to the above-described embodiments, and various modifications may be made without departing from the spirit of the present invention.

10 : 개발자 단말 20 : 클라이언트
30 : 웹디자인 서버 31 : 화면 편집부
32 : 데이터 연결부 33 : 동작 설정부
34 : 문서 생성부
40 : 데이터베이스 50 : 사용자 단말
60 : 웹레포팅 서버 80 : 네트워크10: Developer terminal 20: Client
30: Web design server 31: Screen editor
32: data connection unit 33: operation setting unit
34: Document generating unit
40: Database 50: User terminal
60: Web Reporting Server 80: Network

Claims (6)

Translated fromKorean

그래픽 인터페이스 기반 웹 레포팅 디자인 시스템에 있어서,
다수의 컨트롤 객체를 배치하고 배치된 컨트롤 객체의 속성을 설정하여 웹 레포팅 페이지의 화면을 편집하는 화면 편집부;
상기 웹 레포팅 페이지 내의 컨트롤 객체에 데이터셋을 연결하는 데이터 연결부;
상기 웹 레포팅 페이지 내의 컨트롤 객체에 이벤트 동작을 설정하는 동작 설정부; 및,
상기 웹 레포팅 페이지의 편집 결과를 반영하여, 편집결과를 웹레포팅 문서로서 작성하여 생성하는 문서 생성부를 포함하고,
상기 동작 설정부는 상기 컨트롤 객체의 이벤트를 선택하고, 선택된 해당 이벤트에 대한 이벤트 동작을 설정하되, 상기 이벤트 동작은 다수의 단위 동작들의 상하 순서에 의해 배치하여 작성되고, 단위 동작이 조건문인 경우 각 조건에 따른 하위 동작을 하위 계층으로 구성하여 작성되고,
상기 동작 설정부는 상기 하위 동작은 상하 순서에 의해 배치되는 다수의 단위 동작들로 구성될 수 있고, 상기 하위 동작은 조건문의 단위 동작을 포함할 수 있고, 상기 하위 동작의 조건문의 단위 동작은 각 조건에 따른 동작들이 하위 계층으로 작성되고,
상기 이벤트 동작은 각 단위 동작들이 배치 순서에 의하여 순차적으로 수행되도록 제어되고, 조건문인 단위 동작은 조건에 맞는 하위 계층의 동작들이 수행되도록 제어되는 것을 특징으로 하는 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템.
A graphical interface-based web reporting design system,
A screen editing unit for arranging a plurality of control objects and setting properties of the arranged control objects to edit a screen of the web reporting page;
A data connection unit for connecting a data set to a control object in the web reporting page;
An operation setting unit for setting an event operation to a control object in the web reporting page; And
And a document generation unit that generates an editing result as a web reporting document by reflecting the editing result of the web reporting page,
Wherein the operation setting unit selects an event of the control object and sets an event operation for the selected event, wherein the event operation is created by arranging the plurality of unit operations in the order of up and down, and when the unit operation is a conditional statement, The lower layer is created by constructing the lower layer according to the lower layer,
The operation setting unit may be configured such that the lower operation may be composed of a plurality of unit operations arranged in the order of up and down, the lower operation may include a unit operation of the condition inquiry, Are created in a lower layer,
Wherein the event operation is controlled such that each unit operation is sequentially performed according to the arrangement order, and the unit operation, which is a conditional statement, is controlled such that operations of the lower hierarchy corresponding to the condition are performed.
삭제delete삭제delete제1항에 있어서,
상기 동작 설정부는 상하 순서를 갖는 배치 및 계층 구조의 그래픽을 통해서, 계층구조의 이벤트 동작을 위지윅(WYSIWYG) 방식과 드래그앤드롭(Drag & Drop) 방식으로 처리하도록 제공하는 것을 특징으로 하는 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템.
The method according to claim 1,
Wherein the operation setting unit provides a hierarchical structure for processing an event operation in a WYSIWYG method and a drag and drop method through an arrangement of hierarchical structures and a hierarchical structure. Web reporting design system.
제1항에 있어서,
상기 동작 설정부는 하나의 단위 동작에는 하나의 실행함수를 선택하게 하고, 선택된 실행함수에 대한 옵션을 설정하게 하는 그래픽 인터페이스를 제공하는 것을 특징으로 하는 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템.
The method according to claim 1,
Wherein the operation setting unit provides a graphical interface for allowing one operation to be selected for one unit operation and for setting an option for the selected execution function.
제5항에 있어서,
상기 동작 설정부는 컨트롤 객체의 종류 또는 이벤트의 종류에 따른 적용가능 실행함수들의 목록을 보유하고, 실행함수들을 목록으로 표시하고 목록 중에서 선택하게 하여 실행함수를 결정하는 것을 특징으로 하는 그래픽 인터페이스 기반 웹 레포팅 디자인 시스템.
6. The method of claim 5,
Wherein the operation setting unit holds a list of applicable execution functions according to a kind of a control object or an event type and displays an execution function in a list and selects an execution function from a list, Design system.

Images