wwf
3 天以前 a430284aa21e3ae1f0d5654e55b2ad2852519cc2
app/components/workflow/header/checklist.tsx
@@ -57,20 +57,20 @@
      <PortalToFollowElemTrigger onClick={() => !disabled && setOpen(v => !v)}>
        <div
          className={cn(
            'relative ml-0.5 flex h-7 w-7 items-center justify-center rounded-md',
            disabled && 'cursor-not-allowed opacity-50',
            'relative ml-0.5 flex items-center justify-center w-7 h-7 rounded-md',
            disabled && 'opacity-50 cursor-not-allowed',
          )}
        >
          <div
            className={cn('group flex h-full w-full cursor-pointer items-center justify-center rounded-md hover:bg-state-accent-hover', open && 'bg-state-accent-hover')}
            className={cn('group flex items-center justify-center w-full h-full rounded-md cursor-pointer hover:bg-state-accent-hover', open && 'bg-state-accent-hover')}
          >
            <RiListCheck3
              className={cn('h-4 w-4 group-hover:text-components-button-secondary-accent-text', open ? 'text-components-button-secondary-accent-text' : 'text-components-button-ghost-text')}
              className={cn('w-4 h-4 group-hover:text-components-button-secondary-accent-text', open ? 'text-components-button-secondary-accent-text' : 'text-components-button-ghost-text')}
            />
          </div>
          {
            !!needWarningNodes.length && (
              <div className='absolute -right-1.5 -top-1.5 flex h-[18px] min-w-[18px] items-center justify-center rounded-full border border-gray-100 bg-[#F79009] text-[11px] font-semibold text-white'>
              <div className='absolute -right-1.5 -top-1.5 flex items-center justify-center min-w-[18px] h-[18px] rounded-full border border-gray-100 text-white text-[11px] font-semibold bg-[#F79009]'>
                {needWarningNodes.length}
              </div>
            )
@@ -79,37 +79,37 @@
      </PortalToFollowElemTrigger>
      <PortalToFollowElemContent className='z-[12]'>
        <div
          className='w-[420px] overflow-y-auto rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-lg'
          className='w-[420px] rounded-2xl bg-white border-[0.5px] border-black/5 shadow-lg overflow-y-auto'
          style={{
            maxHeight: 'calc(2 / 3 * 100vh)',
          }}
        >
          <div className='text-md sticky top-0 z-[1] flex h-[44px] items-center bg-components-panel-bg pl-4 pr-3 pt-3 font-semibold text-text-primary'>
          <div className='sticky top-0 bg-white flex items-center pl-4 pr-3 pt-3 h-[44px] text-md font-semibold text-gray-900 z-[1]'>
            <div className='grow'>{t('workflow.panel.checklist')}{needWarningNodes.length ? `(${needWarningNodes.length})` : ''}</div>
            <div
              className='flex h-6 w-6 shrink-0 cursor-pointer items-center justify-center'
              className='shrink-0 flex items-center justify-center w-6 h-6 cursor-pointer'
              onClick={() => setOpen(false)}
            >
              <RiCloseLine className='h-4 w-4 text-text-tertiary' />
              <RiCloseLine className='w-4 h-4 text-gray-500' />
            </div>
          </div>
          <div className='py-2'>
            {
              !!needWarningNodes.length && (
                <>
                  <div className='px-4 text-xs text-text-tertiary'>{t('workflow.panel.checklistTip')}</div>
                  <div className='px-4 text-xs text-gray-400'>{t('workflow.panel.checklistTip')}</div>
                  <div className='px-4 py-2'>
                    {
                      needWarningNodes.map(node => (
                        <div
                          key={node.id}
                          className='mb-2 cursor-pointer rounded-lg border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xs last-of-type:mb-0'
                          className='mb-2 last-of-type:mb-0 border-[0.5px] border-gray-200 bg-white shadow-xs rounded-lg cursor-pointer'
                          onClick={() => {
                            handleNodeSelect(node.id)
                            setOpen(false)
                          }}
                        >
                          <div className='flex h-9 items-center p-2 text-xs font-medium text-text-secondary'>
                          <div className='flex items-center p-2 h-9 text-xs font-medium text-gray-700'>
                            <BlockIcon
                              type={node.type}
                              className='mr-1.5'
@@ -119,12 +119,12 @@
                              {node.title}
                            </span>
                          </div>
                          <div className='border-t-[0.5px] border-divider-regular'>
                          <div className='border-t-[0.5px] border-t-black/2'>
                            {
                              node.unConnected && (
                                <div className='px-3 py-2 last:rounded-b-lg'>
                                  <div className='flex text-xs leading-[18px] text-text-tertiary'>
                                    <AlertTriangle className='mr-2 mt-[3px] h-3 w-3 text-[#F79009]' />
                                <div className='px-3 py-2 bg-gray-25 rounded-b-lg'>
                                  <div className='flex text-xs leading-[18px] text-gray-500'>
                                    <AlertTriangle className='mt-[3px] mr-2 w-3 h-3 text-[#F79009]' />
                                    {t('workflow.common.needConnectTip')}
                                  </div>
                                </div>
@@ -132,9 +132,9 @@
                            }
                            {
                              node.errorMessage && (
                                <div className='px-3 py-2 last:rounded-b-lg'>
                                  <div className='flex text-xs leading-[18px] text-text-tertiary'>
                                    <AlertTriangle className='mr-2 mt-[3px] h-3 w-3 text-[#F79009]' />
                                <div className='px-3 py-2 bg-gray-25 rounded-b-lg'>
                                  <div className='flex text-xs leading-[18px] text-gray-500'>
                                    <AlertTriangle className='mt-[3px] mr-2 w-3 h-3 text-[#F79009]' />
                                    {node.errorMessage}
                                  </div>
                                </div>
@@ -150,8 +150,8 @@
            }
            {
              !needWarningNodes.length && (
                <div className='mx-4 mb-3 rounded-lg bg-components-panel-bg py-4 text-center text-xs text-text-tertiary'>
                  <ChecklistSquare className='mx-auto mb-[5px] h-8 w-8 text-text-quaternary' />
                <div className='mx-4 mb-3 py-4 rounded-lg bg-gray-50 text-gray-400 text-xs text-center'>
                  <ChecklistSquare className='mx-auto mb-[5px] w-8 h-8 text-gray-300' />
                  {t('workflow.panel.checklistResolved')}
                </div>
              )