@ebiz/designer-components 0.0.18

package/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@ebiz/designer-components",
+  "version": "0.0.18",
+  "private": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "main": "./src/index.js",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@opentiny/vue": "~3.20.0",
+    "@opentiny/vue-design-smb": "~3.20.0",
+    "@opentiny/vue-icon": "~3.20.0",
+    "axios": "^1.8.1",
+    "echarts": "^5.6.0",
+    "tdesign-vue-next": "^1.10.6",
+    "unplugin-auto-import": "^19.0.0",
+    "unplugin-vue-components": "^28.0.0",
+    "vue": "^3.5.13",
+    "vue-router": "^4.2.5"
+  },
+  "devDependencies": {
+    "@opentiny/tiny-engine-mock": "^2.1.0",
+    "@opentiny/tiny-engine-vite-config": "^2.1.0",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "less": "^4.2.0",
+    "vite": "^6.0.5",
+    "vite-plugin-proxy": "^0.5.0"
+  }
+}

package/src/App.vue

@@ -0,0 +1,26 @@
+<script>
+export default {
+  name: 'App'
+}
+</script>
+
+<template>
+  <div id="app">
+    <router-view></router-view>
+  </div>
+</template>
+
+<style>
+#app {
+  font-family: Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  color: #2c3e50;
+}
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+</style>

package/src/apiService/SIMPLE_DATA_SERVICE.md

@@ -0,0 +1,285 @@
+# 简洁数据服务使用指南
+
+这个简洁数据服务提供了基本的数据操作方法，包括列表查询、详情查询、数据写入、数据修改、数据删除，每个方法都包含基础的API配置，包括apiId参数。**所有接口均使用POST方法提交**，包括查询接口。
+
+## 配置
+
+数据服务通过环境变量配置域名，支持以下环境变量：
+
+- `VUE_APP_API_BASE_URL`: 在Vue CLI项目中使用
+- `VITE_API_BASE_URL`: 在Vite项目中使用
+
+您可以在项目的`.env`文件中配置这些环境变量：
+
+```
+# .env.development
+VITE_API_BASE_URL=http://localhost:3000/api
+
+# .env.production
+VITE_API_BASE_URL=https://api.example.com
+```
+
+## 基本用法
+
+### 导入组件
+
+```javascript
+// 导入数据服务
+import { dataService } from '@ebiz/lowcode-components';
+```
+
+### 查询列表数据 (POST方法)
+
+```javascript
+// 查询用户列表
+dataService.queryList('/users/list', { page: 1, pageSize: 10 }, { apiId: 'getUserList' })
+  .then(data => {
+    console.log('用户列表:', data);
+  })
+  .catch(error => {
+    console.error('获取用户列表失败:', error);
+  });
+
+// 使用自定义API配置
+dataService.queryList('/users/list', { status: 'active' }, {
+  apiId: 'getActiveUsers',
+  headers: {
+    'X-Custom-Header': 'custom-value'
+  },
+  timeout: 10000
+})
+  .then(data => {
+    console.log('活跃用户列表:', data);
+  })
+  .catch(error => {
+    console.error('获取活跃用户列表失败:', error);
+  });
+```
+
+### 查询详情数据 (POST方法)
+
+```javascript
+// 查询用户详情
+dataService.queryDetail('/users/detail', '123', {}, { apiId: 'getUserDetail' })
+  .then(data => {
+    console.log('用户详情:', data);
+  })
+  .catch(error => {
+    console.error('获取用户详情失败:', error);
+  });
+
+// 查询用户详情，包含关联数据
+dataService.queryDetail('/users/detail', '123', { include: 'orders,profile' }, { apiId: 'getUserDetailWithRelations' })
+  .then(data => {
+    console.log('用户详情(包含关联数据):', data);
+  })
+  .catch(error => {
+    console.error('获取用户详情失败:', error);
+  });
+```
+
+### 新增数据 (POST方法)
+
+```javascript
+// 创建用户
+dataService.create('/users/create', {
+  name: '张三',
+  email: 'zhangsan@example.com',
+  role: 'user'
+}, { apiId: 'createUser' })
+  .then(data => {
+    console.log('创建用户成功:', data);
+  })
+  .catch(error => {
+    console.error('创建用户失败:', error);
+  });
+
+// 使用自定义API配置创建用户
+dataService.create('/users/create', {
+  name: '李四',
+  email: 'lisi@example.com',
+  role: 'admin'
+}, {
+  apiId: 'createAdminUser',
+  headers: {
+    'X-Admin-Create': 'true'
+  }
+})
+  .then(data => {
+    console.log('创建管理员用户成功:', data);
+  })
+  .catch(error => {
+    console.error('创建管理员用户失败:', error);
+  });
+```
+
+### 更新数据 (POST方法)
+
+```javascript
+// 更新用户
+dataService.update('/users/update', '123', {
+  name: '张三(已更新)',
+  email: 'zhangsan_updated@example.com'
+}, { apiId: 'updateUser' })
+  .then(data => {
+    console.log('更新用户成功:', data);
+  })
+  .catch(error => {
+    console.error('更新用户失败:', error);
+  });
+
+// 使用自定义API配置更新用户
+dataService.update('/users/update', '123', {
+  status: 'inactive'
+}, {
+  apiId: 'updateUserStatus',
+  headers: {
+    'X-Status-Update': 'true'
+  }
+})
+  .then(data => {
+    console.log('更新用户状态成功:', data);
+  })
+  .catch(error => {
+    console.error('更新用户状态失败:', error);
+  });
+```
+
+### 删除数据 (POST方法)
+
+```javascript
+// 删除用户
+dataService.delete('/users/delete', '123', {}, { apiId: 'deleteUser' })
+  .then(data => {
+    console.log('删除用户成功:', data);
+  })
+  .catch(error => {
+    console.error('删除用户失败:', error);
+  });
+
+// 软删除用户
+dataService.delete('/users/delete', '123', { soft: true }, { apiId: 'softDeleteUser' })
+  .then(data => {
+    console.log('软删除用户成功:', data);
+  })
+  .catch(error => {
+    console.error('软删除用户失败:', error);
+  });
+```
+
+### 批量操作 (POST方法)
+
+```javascript
+// 批量删除用户
+dataService.batch('/users/batch', 'delete', ['123', '456', '789'], {}, { apiId: 'batchDeleteUsers' })
+  .then(data => {
+    console.log('批量删除用户成功:', data);
+  })
+  .catch(error => {
+    console.error('批量删除用户失败:', error);
+  });
+
+// 批量更新用户状态
+dataService.batch('/users/batch', 'update', ['123', '456'], {
+  status: 'active'
+}, { apiId: 'batchUpdateUserStatus' })
+  .then(data => {
+    console.log('批量更新用户状态成功:', data);
+  })
+  .catch(error => {
+    console.error('批量更新用户状态失败:', error);
+  });
+```
+
+## 请求数据格式
+
+所有方法都使用POST方法提交数据，请求体格式如下：
+
+### 查询列表
+```json
+{
+  "page": 1,
+  "pageSize": 10,
+  "其他查询参数": "值"
+}
+```
+
+### 查询详情
+```json
+{
+  "id": "123",
+  "include": "orders,profile",
+  "其他查询参数": "值"
+}
+```
+
+### 新增数据
+```json
+{
+  "name": "张三",
+  "email": "zhangsan@example.com",
+  "role": "user",
+  "其他字段": "值"
+}
+```
+
+### 更新数据
+```json
+{
+  "id": "123",
+  "name": "张三(已更新)",
+  "email": "zhangsan_updated@example.com",
+  "其他字段": "值"
+}
+```
+
+### 删除数据
+```json
+{
+  "id": "123",
+  "soft": true,
+  "其他参数": "值"
+}
+```
+
+### 批量操作
+```json
+{
+  "action": "delete",
+  "ids": ["123", "456", "789"],
+  "其他参数": "值"
+}
+```
+
+## API配置选项
+
+每个方法都支持自定义API配置，常用的配置选项包括：
+
+| 配置项 | 类型 | 说明 |
+|-------|------|------|
+| apiId | String | API标识，用于标识请求的API |
+| headers | Object | 自定义请求头 |
+| timeout | Number | 请求超时时间(毫秒) |
+| withCredentials | Boolean | 是否携带凭证(cookies) |
+| responseType | String | 响应类型，如'json'、'blob'、'text'等 |
+
+示例：
+
+```javascript
+// 使用完整的API配置
+dataService.queryList('/users/list', { page: 1 }, {
+  apiId: 'getUserListWithConfig',
+  headers: {
+    'X-Custom-Header': 'custom-value'
+  },
+  timeout: 15000,
+  withCredentials: true,
+  responseType: 'json'
+})
+  .then(data => {
+    console.log('用户列表:', data);
+  })
+  .catch(error => {
+    console.error('获取用户列表失败:', error);
+  });
+```

package/src/apiService/simpleDataService.js

@@ -0,0 +1,174 @@
+/**
+ * 简洁数据服务
+ * 提供基本的数据操作方法，包含列表查询、详情查询、数据写入、数据修改、数据删除
+ * 所有接口均使用POST方法提交
+ */
+
+import axios from "axios";
+import { TinyNotify } from "@opentiny/vue";
+
+// 从环境变量获取API基础URL
+const API_BASE_URL = "http://localhost:8090/api";
+
+/**
+ * 创建axios实例
+ */
+const axiosInstance = axios.create({
+  baseURL: API_BASE_URL,
+  timeout: 30000,
+  headers: {
+    "Content-Type": "application/json",
+    Accept: "application/json",
+  },
+});
+
+/**
+ * 请求拦截器
+ */
+axiosInstance.interceptors.request.use(
+  (config) => {
+    // 添加认证信息
+    const token = localStorage.getItem("token");
+    if (token) {
+      config.headers["Authorization"] = `Bearer ${token}`;
+    }
+    return config;
+  },
+  (error) => {
+    return Promise.reject(error);
+  }
+);
+
+/**
+ * 响应拦截器
+ */
+axiosInstance.interceptors.response.use(
+  (response) => {
+    const { data } = response;
+
+    // 根据后端API的响应格式进行调整
+    if (data.code === 0) {
+      return data.data;
+    } else {
+      // message.error(data.message || '请求失败');
+      return Promise.reject(new Error(data.message || "请求失败"));
+    }
+  },
+  (error) => {
+    // 错误处理
+    if (error.response) {
+      const { status } = error.response;
+
+      switch (status) {
+        case 401:
+          TinyNotify({
+            type: "warning",
+            title: "未授权",
+            message: "您无权限访问，请授权后重试",
+            position: "top-right",
+            duration: 2000,
+          });
+          break;
+        case 403:
+          TinyNotify({
+            type: "warning",
+            title: "权限不足",
+            message: "禁止访问，权限不足",
+            position: "top-right",
+            duration: 2000,
+          });
+          break;
+        case 404:
+          TinyNotify({
+            type: "warning",
+            title: "404",
+            message: "请求的资源不存在",
+            position: "top-right",
+            duration: 2000,
+          });
+          break;
+        case 500:
+          TinyNotify({
+            type: "warning",
+            title: "错误",
+            message: "服务器内部错误",
+            position: "top-right",
+            duration: 2000,
+          });
+          break;
+        default:
+          TinyNotify({
+            type: "warning",
+            title: "请求失败",
+            message: error.message,
+            position: "top-right",
+            duration: 2000,
+          });
+      }
+    } else {
+      TinyNotify({
+        type: "error",
+        title: "网络错误",
+        message: error.message,
+        position: "top-right",
+        duration: 2000,
+      });
+      // message.error('网络错误，请检查您的网络连接');
+    }
+
+    return Promise.reject(error);
+  }
+);
+
+let apiMap = {
+  MULTIPLE_DATA_SEARCH: "/appdata/select",
+  DETAILS_DATA: "/appdata/detailData",
+  INTERFACE_PLUGIN: "/appdata/plugin",
+  DATA_INSERT: "/appdata/addData",
+  BATCH_DATA_INSERT: "/appdata/addDatas",
+  DATA_MODIFY: "/appdata/updateData",
+  BATCH_DATA_MODIFY: "/appdata/updateDatas",
+  DEL_DATA: "/appdata/delData",
+  BATCH_DEL_DATA: "/appdata/delDatas",
+  MULTIPLE_DATA_LINK_SEARCH: "/api/appdata/link/select",
+};
+
+/**
+ * 数据服务
+ */
+const dataService = {
+  /**
+   * 请求数据 (POST方法)
+   * @param {string} url - 请求URL
+   * @param {Object} [params] - 查询参数
+   * @param {Object} [apiConfig] - API配置
+   * @param {string} [apiConfig.apiId] - API标识
+   * @param {string} [apiConfig.apiType] - API类型
+   * @returns {Promise<any>} 响应数据
+   * @example
+   */
+  fetch: (params = {}, apiConfig = {}, url = "") => {
+    if (!url) {
+      url = apiMap[apiConfig.apiType];
+    }
+
+    const { apiId = "", ...restConfig } = apiConfig;
+
+    const defaultConfig = {
+      // 默认列表查询配置
+      headers: {
+        "X-List-Query": "true",
+      },
+      timeout: 20000,
+    };
+    if (!params) {
+      params = {};
+    }
+    params.apiId = apiConfig.apiId;
+
+    const config = { ...defaultConfig, ...restConfig };
+    return axiosInstance.post(url, params, config);
+  },
+};
+
+export default dataService;

package/src/assets/base.css

@@ -0,0 +1,86 @@
+/* color palette from <https://github.com/vuejs/theme> */
+:root {
+  --vt-c-white: #ffffff;
+  --vt-c-white-soft: #f8f8f8;
+  --vt-c-white-mute: #f2f2f2;
+
+  --vt-c-black: #181818;
+  --vt-c-black-soft: #222222;
+  --vt-c-black-mute: #282828;
+
+  --vt-c-indigo: #2c3e50;
+
+  --vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
+  --vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
+  --vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
+  --vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
+
+  --vt-c-text-light-1: var(--vt-c-indigo);
+  --vt-c-text-light-2: rgba(60, 60, 60, 0.66);
+  --vt-c-text-dark-1: var(--vt-c-white);
+  --vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
+}
+
+/* semantic color variables for this project */
+:root {
+  --color-background: var(--vt-c-white);
+  --color-background-soft: var(--vt-c-white-soft);
+  --color-background-mute: var(--vt-c-white-mute);
+
+  --color-border: var(--vt-c-divider-light-2);
+  --color-border-hover: var(--vt-c-divider-light-1);
+
+  --color-heading: var(--vt-c-text-light-1);
+  --color-text: var(--vt-c-text-light-1);
+
+  --section-gap: 160px;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-background: var(--vt-c-black);
+    --color-background-soft: var(--vt-c-black-soft);
+    --color-background-mute: var(--vt-c-black-mute);
+
+    --color-border: var(--vt-c-divider-dark-2);
+    --color-border-hover: var(--vt-c-divider-dark-1);
+
+    --color-heading: var(--vt-c-text-dark-1);
+    --color-text: var(--vt-c-text-dark-2);
+  }
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  font-weight: normal;
+}
+
+body {
+  min-height: 100vh;
+  color: var(--color-text);
+  background: var(--color-background);
+  transition:
+    color 0.5s,
+    background-color 0.5s;
+  line-height: 1.6;
+  font-family:
+    Inter,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    Roboto,
+    Oxygen,
+    Ubuntu,
+    Cantarell,
+    'Fira Sans',
+    'Droid Sans',
+    'Helvetica Neue',
+    sans-serif;
+  font-size: 15px;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}

package/src/assets/logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>

package/src/assets/main.css

@@ -0,0 +1 @@
+@import './base.css';

package/src/assets/styles/charts/main.less

@@ -0,0 +1,30 @@
+/**
+ * Import all chart less files
+ */
+
+// Import main charts less file
+@import '../../../components/charts/index.less';
+
+// Import chart features
+@import '../../../components/charts/feature/drag/index.less';
+@import '../../../components/charts/feature/card/index.less';
+@import '../../../components/charts/feature/expandLegend/index.less';
+
+// Import chart components
+@import '../../../components/charts/components/FlowChart/index.less';
+@import '../../../components/charts/components/GanttChart/index.less';
+@import '../../../components/charts/components/HoneycombChart/index.less';
+@import '../../../components/charts/components/OrganizationChart/index.less';
+@import '../../../components/charts/components/RiverChart/index.less';
+@import '../../../components/charts/components/SnowFlakeChart/index.less';
+@import '../../../components/charts/components/TerraceChart/index.less';
+@import '../../../components/charts/components/TimelineChart/index.less';
+@import '../../../components/charts/components/WaveChart/index.less';
+@import '../../../components/charts/components/MilestoneChart/index.less';
+
+// Import chart framework modules
+@import '../../../components/charts/framework/charts/MindmapChart/index.less';
+@import '../../../components/charts/framework/module/line/index.less';
+@import '../../../components/charts/framework/module/connector/index.less';
+@import '../../../components/charts/framework/module/canvas/index.less';
+@import '../../../components/charts/framework/module/contextmenu/index.less';