### Project Setup and Development Server (Bash)

Source: https://github.com/jitai-team/jitai-docs/blob/master/CONTRIBUTING_ZH.md

Provides essential bash commands for setting up the project development environment. This includes cloning the repository, installing dependencies, and starting the local development server to preview changes.

```bash
# Fork 仓库到您的 GitHub 账户
# 然后克隆您的 fork

git clone https://github.com/YOUR_USERNAME/jitai-docs.git
cd jitai-docs

# 添加上游仓库
git remote add upstream https://github.com/jitai-team/jitai-docs.git

npm install

npm start
```

--------------------------------

### Start JitAi Development Server (Yarn/NPM)

Source: https://github.com/jitai-team/jitai-docs/blob/master/README_ZH.md

This command starts the local development server for JitAi documentation. It allows for real-time previewing of changes. Access the documentation at http://localhost:3000 after running this command. Requires dependencies to be installed first.

```bash
yarn start
# 或者使用 npm
npm run start
```

--------------------------------

### Conventional Commits Example (Text)

Source: https://github.com/jitai-team/jitai-docs/blob/master/CONTRIBUTING_ZH.md

An example illustrating the Conventional Commits format for commit messages. It demonstrates the structure including type, scope, description, body, and footer, and provides specific examples for `feat` and `fix` types.

```text
docs: 添加 API 认证章节

为开发者指南添加了详细的 API 认证说明，包括：
- JWT 令牌获取和使用
- API 密钥管理
- 权限范围说明

Closes #123
```

--------------------------------

### Install Project Dependencies (Yarn/NPM)

Source: https://github.com/jitai-team/jitai-docs/blob/master/README_ZH.md

This snippet demonstrates how to install project dependencies using either Yarn or NPM. It's a crucial step before running the development server or building the project. Ensure Node.js and Yarn/NPM are installed.

```bash
yarn install
# 或者使用 npm
npm install
```

--------------------------------

### Docusaurus Admonition Examples

Source: https://github.com/jitai-team/jitai-docs/blob/master/CONTRIBUTING_ZH.md

Demonstrates how to use Docusaurus's admonition components (tip, info, warning, danger) within Markdown files to highlight important information. These components help in structuring and visually distinguishing different types of content for better readability.

```markdown
:::tip 提示
这是一个有用的提示信息。
:::

:::info 信息
这是一般性信息。
:::

:::warning 警告
这是需要注意的警告信息。
:::

:::danger 危险
这是严重警告信息。
:::
```

--------------------------------

### List Component Configuration

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/components/view-type/list.md

Provides examples and a detailed breakdown of the configuration properties for the List component.

```APIDOC
## Basic List Configuration Example

```typescript
{
  "fullName": "components.List",
  "type": "components.List", 
  "name": "CustomerList",
  "title": "Customer List",
  "config": {
    "requireElements": [
      {
        "title": "Customer Data Model",
        "type": "models.Meta",
        "name": "models.CustomerModel",
        "filter": "",
        "orderBy": ""
      }
    ],
    "fieldIdList": [
      "id",
      "custName", 
      "phone",
      "company"
    ],
    "defaultRender": true,
    "title": [],
    "abstract": [
      "custName"
    ]
  },
  "showTitle": true
}
```

### Configuration Properties

| Property Name | Type | JitAI Type | Description | Example Value |
|--------|------|----------|------|---------|
| requireElements | Array | - | Required elements configuration, specifies data model | `[{...}]` |
| fieldIdList | Array | List | List of fields to display | `["id", "name"]` |
| defaultRender | Boolean | Checkbox | Whether to use default rendering | `true` |
| title | Array | List | Title configuration | `[]` |
| abstract | Array | List | Abstract field configuration | `["custName"]` |
| actionBtn | Array | List | Action button configuration | `[{...}]` |
| toolLeftBtn | Array | List | Left toolbar buttons | `[{...}]` |
| toolRightBtn | Array | List | Right toolbar buttons | `[{...}]` |
| bottomBtn | Array | List | Bottom button configuration | `[{...}]` |
| couldClickRow | Boolean | Checkbox | Whether to allow row clicking | `true` |
```

--------------------------------

### Python Example: Set Cache Value

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitStorage/cache/redis-cache.md

Shows how to write string data to the Redis cache. This example demonstrates setting a value permanently and setting a value with a specified expiration time in seconds.

```python
cache = app.getElement("caches.MyRedis")

# Set permanent cache
success = cache.set("config:theme", "dark")

# Set cache with expiration time
success = cache.set("verification_code", "123456", 300)  # Expires in 5 minutes
```

--------------------------------

### Python Example: Get Cache Value

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitStorage/cache/redis-cache.md

Illustrates how to retrieve a string value from the Redis cache using a specified key. It includes an example of checking if the retrieved value exists before printing it.

```python
cache = app.getElement("caches.MyRedis")
value = cache.get("user_token")
if value:
    print(f"User token: {value}")
```

--------------------------------

### Python Example for Redis Cache Operations

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitStorage/cache/redis-cache.md

Demonstrates how to use the Redis cache in Python. It covers obtaining a cache instance and performing standard string operations (set, get), numeric operations (setNumeric, getNumeric, incr), expiration time control (expire), and key management (exists, delete).

```python
# Get cache instance
cache = app.getElement("caches.MyRedis")

# Basic string operationscache.set("user:1001", "张三", 3600)  # Set user info, expire in 1 hour
user_name = cache.get("user:1001")   # Get user info

# Numeric operationscache.setNumeric("visit_count", 100)      # Set visit count
count = cache.getNumeric("visit_count")   # Get visit count
new_count = cache.incr("visit_count", 5)  # Increase by 5 visits

# Expiration time controlcache.expire("session:abc123", 1800)  # Extend session expiration to 30 minutes

# Key management
if cache.exists("user:1001"):         # Check if key exists
    cache.delete("user:1001")         # Delete key
```

--------------------------------

### Clone JitAi Documentation Repository

Source: https://github.com/jitai-team/jitai-docs/blob/master/README_ZH.md

This command clones the JitAi documentation repository from GitHub to your local machine. It's the first step in setting up the project locally. Make sure you have Git installed.

```bash
git clone https://github.com/jitai-team/jitai-docs.git
cd jitai-docs
```

--------------------------------

### Page Inheritance Configuration

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/pages/data-entry-page.md

Example of configuring page inheritance. This allows creating new pages that extend existing ones, promoting code reuse and a structured approach to page development. The 'extend' property specifies the parent page.

```json
{
  "type": "pages.FormPageType",
  "title": "Advanced Customer Entry Page",
  "extend": "pages.BasicCustomerForm",
  "dataModel": "models.CustomerModel"
}
```

--------------------------------

### Build and Serve JitAi Documentation (Yarn/NPM)

Source: https://github.com/jitai-team/jitai-docs/blob/master/README_ZH.md

These commands are used to build the static files for production deployment and then serve them locally for preview. 'yarn build' creates the optimized production assets, and 'yarn serve' allows you to preview these built assets before deployment.

```bash
# 构建静态文件
yarn build

# 预览构建结果
yarn serve
```

--------------------------------

### Dynamically Load and Configure Components in TypeScript

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/pages/data-entry-page.md

Shows how to dynamically add and configure components at runtime within a Jitai page. This example demonstrates creating a new component, binding it to the application and page, adding it to the component dictionary, and updating the page layout.

```typescript
class PageCls extends Jit.GridPage {
    async addDynamicComponent() {
        // 创建新组件
        const newComp = await this.newComponent('components.Button', {
            name: 'dynamicBtn',
            title: '动态按钮',
            config: {
                btnType: 'default'
            }
        });
        
        // 绑定到页面
        newComp.bindApp(this.app);
        newComp.bindPage(this);
        
        // 添加到组件字典
        this.compInsDict['dynamicBtn'] = newComp;
        this[newComp.name] = newComp;
        
        // 更新布局
        this.scheme.layout.push({
            i: 'dynamicBtn',
            x: 0,
            y: 10,
            w: 12,
            h: 4
        });
        
        this.refresh();
    }
}
```

--------------------------------

### Docusaurus Code Block Highlighting

Source: https://github.com/jitai-team/jitai-docs/blob/master/CONTRIBUTING_ZH.md

Shows how to create highlighted code blocks in Docusaurus Markdown, including the ability to specify a title for the code block. This is useful for presenting code examples with context and language-specific syntax highlighting.

```markdown
```javascript title="示例代码"
const config = {
  title: 'JitAi',
  tagline: '为AI而生的开发平台'
};
```
```

--------------------------------

### Implement Custom Business Service (OrderService) in Python

Source: https://context7.com/jitai-team/jitai-docs/llms.txt

Shows how to create a custom business service 'OrderService' by extending JitAI's 'NormalService'. It includes methods for calculating order totals with discounts and creating new orders, demonstrating the use of JitAI's datatypes for variables and calculations within the service methods.

```python
# services/OrderService/
# ├── e.json
# ├── service.py
# └── __init__.py

# e.json
{
    "title": "订单服务",
    "type": "services.NormalType",
    "backendBundleEntry": ".",
    "functionList": [
        {
            "name": "calculateTotal",
            "title": "计算订单总额",
            "args": [
                {"name": "amount", "title": "金额", "dataType": "Numeric"},
                {"name": "discount", "title": "折扣率", "dataType": "Numeric"}
            ],
            "returnType": "Numeric",
            "argsToDatatype": 1
        },
        {
            "name": "createOrder",
            "title": "创建订单",
            "args": [
                {"name": "customerId", "title": "客户ID", "dataType": "Numeric"},
                {"name": "items", "title": "订单项", "dataType": "JitList", "generic": "JitDict"}
            ],
            "returnType": "RowData",
            "argsToDatatype": 1
        }
    ]
}

# service.py
from datatypes.Meta import datatypes
from services.NormalType import NormalService

class OrderService(NormalService):
    def calculateTotal(self, amount, discount):
        # 使用 JitAI 数据类型定义返回变量
        result = datatypes.Numeric.new({"title": "计算结果"}, 0)

        # 使用公式函数进行计算 (非原生运算符)
        temp = datatypes.Numeric.new({}, (SUB(1, discount.value)))
        result.value = (MUL(amount.value, temp.value))

        return result.value

    def createOrder(self, customerId, items):
        # 获取订单模型
        OrderModel = app.getElement("models.OrderModel")

        # 创建新订单
        order = OrderModel()
        order.customerId.value = customerId.value
        order.status.value = "pending"

        # 计算总金额
        total = datatypes.Numeric.new({"title": "总金额"}, 0)
        for item in items:
            total.value = (SUM(total.value, item.price.value))

        order.totalAmount.value = total.value
        order.save()

        return order

# __init__.py
from .service import OrderService

# 调用示例
OrderService = app.getElement("services.OrderService")
total = OrderService.calculateTotal(amount=1000, discount=0.1)
print(f"订单总额: {total}")  # 输出: 订单总额: 900
```

--------------------------------

### Bind Application Instance in TypeScript

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/components/view-type/list.md

This TypeScript example shows the `bindApp` method, which is used to bind an application instance to the List component. This method is typically called automatically by the framework during component initialization. It ensures the component has access to the application context.

```typescript
// Bind application instance (usually called automatically by framework)
listComponent.bindApp(app);
```

--------------------------------

### Issue Reporting Template (Markdown)

Source: https://github.com/jitai-team/jitai-docs/blob/master/CONTRIBUTING_ZH.md

A template for reporting issues in the project's issue tracker. It guides users to provide necessary details such as a clear description, steps to reproduce, expected and actual behavior, and environment information, facilitating efficient bug resolution.

```markdown
## 问题描述
简洁清楚地描述问题是什么。

## 复现步骤
描述复现问题的步骤：
1. 访问页面 '...'
2. 点击 '...'
3. 滚动到 '...'
4. 看到错误

## 期望行为
清楚简洁地描述您期望发生什么。

## 实际行为
清楚简洁地描述实际发生了什么。

## 截图
如果适用，添加截图来帮助解释您的问题。

## 环境信息
- 操作系统: [例如 macOS 12.6]
- 浏览器: [例如 Chrome 108.0]
- 设备: [例如 MacBook Pro 2021]

## 补充信息
添加关于问题的任何其他上下文信息。
```

--------------------------------

### Get Variable Value

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/pages/data-entry-page.md

Retrieves the value of a specified variable, which can be either a page-level variable or a component-level variable. It accepts the variable name or instance as input.

```typescript
// 获取页面变量值
const userName = this.getVariableValue('userName');

// 获取组件变量值
const formData = this.getVariableValue('Form1.formData');
```

--------------------------------

### JitAI AppResource Management in Python

Source: https://context7.com/jitai-team/jitai-docs/llms.txt

Shows how to use the `app.resource` object in Python to manage and access application resources. It covers checking existence, reading file content, loading element and common resources, parsing element names, retrieving app configuration, and cache management.

```python
# 通过 app.resource 访问当前应用的 AppResource 对象

# 检查资源是否存在
exists = app.resource.exists("models/CustomerModel/model.py")

# 读取资源内容
content = app.resource.read("models/CustomerModel/model.py")

# 读取元素资源
element_resources = app.resource.readElementResource("models.CustomerModel", forceLoad=False)

# 读取公共代码包资源
commons_resources = app.resource.readCommonsResource(forceLoad=False)

# 根据路径解析元素 fullName
fullName = app.resource.parseElementByPath("models/CustomerModel/model.py")
# 返回: "models.CustomerModel"

# 获取应用配置信息
app_config = app.resource.getAppJit()

# 清除资源缓存
app.resource.clear()

# 清除特定元素的缓存
app.resource.clearByElement("models.CustomerModel")

# 属性访问
print(f"环境ID: {app.resource.envId}")      # JRE_MWcVmUZjEq
print(f"应用ID: {app.resource.appId}")      # wanyun.MyApp
print(f"版本: {app.resource.version}")       # 1.0.0
```

--------------------------------

### Get Variable Value (TypeScript)

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/pages/ai-data-management-page.md

Retrieves the value of a specified variable by its name or variable instance. It can access both top-level variables and properties of components.

```typescript
const userName = this.getVariableValue("userName");
const tableData = this.getVariableValue("Table1.selectedRowList");
```

--------------------------------

### Get UI Context

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/pages/data-entry-page.md

Fetches the UI context of the page, providing access to function lists and variable information. This is essential for interacting with the page's dynamic elements and data.

```typescript
const context = this.getUIContext();
console.log('页面函数列表:', context.functionList);
console.log('页面变量列表:', context.variables);
```

--------------------------------

### DingTalk Robot Instance Initialization (Python)

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/extguide/extend-element-family-classes.md

This Python file, `__init__.py`, for the `imRobots.dingTalkDemo` instance is typically empty. It serves as a marker for the directory to be recognized as a Python package. For instance elements, the primary configuration is usually handled by associated JSON files.

```python
# Instance elements usually only need empty files

```

--------------------------------

### Create Component

Source: https://github.com/jitai-team/jitai-docs/blob/master/docs/reference/framework/JitWeb/pages/data-entry-page.md

Asynchronously creates a new component. It takes the component type and configuration as arguments and returns a Promise that resolves to the component instance. Example shows creating a 'components.Button'.

```typescript
const button = await this.newComponent('components.Button', {
    name: 'submitBtn',
    title: '提交按钮',
    config: {
        btnType: 'primary'
    }
});
```