openxiangda-cli 2.0.0-alpha.86 → 2.0.0-alpha.90

package/template/apps/web/src/components/resource/ResourceBatchActions.tsx

@@ -1,326 +0,0 @@
-import { DeleteOutlined, EditOutlined, ImportOutlined } from '@ant-design/icons';
-import { Alert, App, Button, Form, Modal, Select, Space, Table, Typography, Upload } from 'antd';
-import dayjs from 'dayjs';
-import type { DataResourceSurface } from 'openxiangda-contracts/browser';
-import { useMemo, useState } from 'react';
-import { transactNativeData } from '../../platform-client';
-import { SurfaceFieldControl, SurfaceFieldValue, type SurfaceField } from './SurfaceFields';
-import { parseResourceImportFile, type ResourceImportPreview } from './resource-import';
-
-type ResourceRecord = Record<string, unknown> & {
-  id: string;
-  revision: number;
-};
-
-export function ResourceImportButton({
-  code,
-  name,
-  surface,
-  writableFieldCodes,
-  onCompleted,
-}: {
-  code: string;
-  name: string;
-  surface: DataResourceSurface;
-  writableFieldCodes: string[];
-  onCompleted: () => Promise<unknown> | unknown;
-}) {
-  const { message } = App.useApp();
-  const [preview, setPreview] = useState<ResourceImportPreview>();
-  const [parsing, setParsing] = useState(false);
-  const [submitting, setSubmitting] = useState(false);
-  const [idempotencyKey, setIdempotencyKey] = useState('');
-  const close = () => {
-    if (submitting) return;
-    setPreview(undefined);
-    setIdempotencyKey('');
-  };
-  const submit = async () => {
-    if (!preview?.operations.length || preview.errors.length) return;
-    setSubmitting(true);
-    try {
-      const key = idempotencyKey || crypto.randomUUID();
-      if (!idempotencyKey) setIdempotencyKey(key);
-      const result = await transactNativeData(preview.operations, key);
-      message.success(`已导入 ${result.items.length} 条${name}`);
-      await onCompleted();
-      setPreview(undefined);
-      setIdempotencyKey('');
-    } catch (error) {
-      message.error(transactionFailureMessage(error, '导入失败'));
-    } finally {
-      setSubmitting(false);
-    }
-  };
-  const previewColumns = useMemo(
-    () => [
-      { title: '行号', dataIndex: 'rowNumber', width: 72 },
-      ...Object.entries(surface.fields)
-        .filter(([code]) => writableFieldCodes.includes(code))
-        .map(([fieldCode, field]) => ({
-          title: field.label,
-          key: fieldCode,
-          render: (_: unknown, row: ResourceImportPreview['rows'][number]) => (
-            <SurfaceFieldValue field={{ key: fieldCode, ...field }} value={row.data[fieldCode]} />
-          ),
-        })),
-    ],
-    [surface.fields, writableFieldCodes]
-  );
-  return (
-    <>
-      <Upload
-        accept=".csv,.xls,.xlsx"
-        beforeUpload={async (file) => {
-          setParsing(true);
-          try {
-            setPreview(await parseResourceImportFile(file, code, surface, writableFieldCodes));
-            setIdempotencyKey(crypto.randomUUID());
-          } catch (error) {
-            message.error(error instanceof Error ? error.message : '文件解析失败');
-          } finally {
-            setParsing(false);
-          }
-          return Upload.LIST_IGNORE;
-        }}
-        maxCount={1}
-        showUploadList={false}
-      >
-        <Button
-          disabled={!writableFieldCodes.length}
-          icon={<ImportOutlined />}
-          loading={parsing}
-          title={!writableFieldCodes.length ? '当前角色没有可导入字段' : undefined}
-        >
-          导入
-        </Button>
-      </Upload>
-      <Modal
-        cancelText="取消"
-        destroyOnHidden
-        okButtonProps={{ disabled: Boolean(preview?.errors.length) }}
-        okText={`确认导入${preview?.operations.length ? ` ${preview.operations.length} 条` : ''}`}
-        open={Boolean(preview)}
-        title={`导入${name}`}
-        width={960}
-        confirmLoading={submitting}
-        onCancel={close}
-        onOk={() => void submit()}
-      >
-        {preview && (
-          <Space direction="vertical" size="middle" style={{ width: '100%' }}>
-            <Typography.Text type="secondary">{preview.fileName} · 单次最多 100 行，所有数据将作为一个事务提交</Typography.Text>
-            {preview.errors.length > 0 && (
-              <Alert
-                description={
-                  <ul className="oxa-import-errors">
-                    {preview.errors.slice(0, 20).map((error) => (
-                      <li key={error}>{error}</li>
-                    ))}
-                    {preview.errors.length > 20 && <li>另有 {preview.errors.length - 20} 个错误</li>}
-                  </ul>
-                }
-                message="请先修正导入文件"
-                showIcon
-                type="error"
-              />
-            )}
-            <Table
-              columns={previewColumns}
-              dataSource={preview.rows.slice(0, 20)}
-              locale={{ emptyText: '没有可预览的数据' }}
-              pagination={false}
-              rowKey="rowNumber"
-              scroll={{ x: 'max-content', y: 360 }}
-              size="small"
-            />
-            {preview.rows.length > 20 && <Typography.Text type="secondary">仅预览前 20 行</Typography.Text>}
-          </Space>
-        )}
-      </Modal>
-    </>
-  );
-}
-
-export function ResourceBatchActions({
-  code,
-  name,
-  surface,
-  rows,
-  writableFields,
-  canDelete,
-  onCompleted,
-  onClear,
-}: {
-  code: string;
-  name: string;
-  surface: DataResourceSurface;
-  rows: ResourceRecord[];
-  writableFields: SurfaceField[];
-  canDelete: boolean;
-  onCompleted: () => Promise<unknown> | unknown;
-  onClear: () => void;
-}) {
-  const { message } = App.useApp();
-  const [form] = Form.useForm();
-  const [updateOpen, setUpdateOpen] = useState(false);
-  const [deleteOpen, setDeleteOpen] = useState(false);
-  const [submitting, setSubmitting] = useState(false);
-  const [selectedField, setSelectedField] = useState('');
-  const [idempotencyKey, setIdempotencyKey] = useState('');
-  if (!rows.length) return null;
-  const submitUpdate = async (values: Record<string, unknown>) => {
-    const field = writableFields.find((item) => item.key === selectedField);
-    if (!field) return;
-    const value = normalizeValue(field, values[selectedField]);
-    const changed = rows.filter((row) => !sameValue(row[selectedField], value));
-    if (!changed.length) {
-      message.info('所选记录的该字段已经是目标值');
-      return;
-    }
-    setSubmitting(true);
-    try {
-      const key = idempotencyKey || crypto.randomUUID();
-      if (!idempotencyKey) setIdempotencyKey(key);
-      await transactNativeData(
-        changed.map((row) => ({
-          operation: 'update',
-          resourceCode: code,
-          id: row.id,
-          expectedRevision: row.revision,
-          data: { [selectedField]: value },
-        })),
-        key
-      );
-      message.success(`已更新 ${changed.length} 条${name}`);
-      await onCompleted();
-      onClear();
-      setUpdateOpen(false);
-      setIdempotencyKey('');
-      form.resetFields();
-      setSelectedField('');
-    } catch (error) {
-      message.error(transactionFailureMessage(error, '批量更新失败'));
-    } finally {
-      setSubmitting(false);
-    }
-  };
-  const submitDelete = async () => {
-    setSubmitting(true);
-    try {
-      const key = idempotencyKey || crypto.randomUUID();
-      if (!idempotencyKey) setIdempotencyKey(key);
-      await transactNativeData(
-        rows.map((row) => ({
-          operation: 'delete',
-          resourceCode: code,
-          id: row.id,
-          expectedRevision: row.revision,
-        })),
-        key
-      );
-      message.success(`已删除 ${rows.length} 条${name}`);
-      await onCompleted();
-      onClear();
-      setDeleteOpen(false);
-      setIdempotencyKey('');
-    } catch (error) {
-      message.error(transactionFailureMessage(error, '批量删除失败'));
-    } finally {
-      setSubmitting(false);
-    }
-  };
-  const field = writableFields.find((item) => item.key === selectedField);
-  return (
-    <>
-      <div className="oxa-batch-bar">
-        <Typography.Text>已选择 {rows.length} 条</Typography.Text>
-        <Space>
-          {writableFields.length > 0 && (
-            <Button icon={<EditOutlined />} onClick={() => setUpdateOpen(true)}>
-              批量修改
-            </Button>
-          )}
-          {canDelete && (
-            <Button danger icon={<DeleteOutlined />} onClick={() => setDeleteOpen(true)}>
-              批量删除
-            </Button>
-          )}
-          <Button onClick={onClear} type="link">
-            取消选择
-          </Button>
-        </Space>
-      </div>
-      <Modal
-        cancelText="取消"
-        okText="确认修改"
-        open={updateOpen}
-        title={`批量修改 ${rows.length} 条${name}`}
-        confirmLoading={submitting}
-        onCancel={() => !submitting && setUpdateOpen(false)}
-        onOk={() => form.submit()}
-      >
-        <Form
-          form={form}
-          layout="vertical"
-          onFinish={(values) => void submitUpdate(values as Record<string, unknown>)}
-          onValuesChange={() => setIdempotencyKey('')}
-        >
-          <Form.Item label="修改字段" required>
-            <Select
-              options={writableFields.map((item) => ({
-                label: item.label,
-                value: item.key,
-              }))}
-              placeholder="选择要统一修改的字段"
-              value={selectedField || undefined}
-              onChange={(value) => {
-                form.resetFields();
-                setSelectedField(value);
-                setIdempotencyKey('');
-              }}
-            />
-          </Form.Item>
-          {field && (
-            <SurfaceFieldControl
-              disabled={false}
-              field={{ ...field, requiredHint: true }}
-              operation="update"
-              resourceCode={code}
-            />
-          )}
-        </Form>
-      </Modal>
-      <Modal
-        cancelText="取消"
-        okButtonProps={{ danger: true }}
-        okText="确认删除"
-        open={deleteOpen}
-        title={`删除 ${rows.length} 条${name}`}
-        confirmLoading={submitting}
-        onCancel={() => !submitting && setDeleteOpen(false)}
-        onOk={() => void submitDelete()}
-      >
-        <Alert description="任意一条记录发生权限或版本冲突时，本次删除将全部回滚。" message="删除后不可恢复" showIcon type="warning" />
-      </Modal>
-    </>
-  );
-}
-
-function normalizeValue(field: SurfaceField, value: unknown) {
-  if (field.widget !== 'date' && field.widget !== 'datetime') return value;
-  if (!value) return value;
-  return field.widget === 'datetime' ? dayjs(value as never).toISOString() : dayjs(value as never).format('YYYY-MM-DD');
-}
-
-function sameValue(left: unknown, right: unknown) {
-  if (left === right) return true;
-  if (left === undefined || right === undefined) return false;
-  return JSON.stringify(left) === JSON.stringify(right);
-}
-
-function transactionFailureMessage(error: unknown, fallback: string) {
-  const index = Number((error as any)?.data?.operationIndex);
-  const message = error instanceof Error ? error.message : fallback;
-  return Number.isSafeInteger(index) && index >= 0 ? `第 ${index + 1} 条操作失败：${message}` : message;
-}