feat: first commit

2025-03-31 22:34:22 +08:00
commit d25187c9c8
390 changed files with 57031 additions and 0 deletions
--- a/src/fragments/job/my-group/index.less
+++ b/src/fragments/job/my-group/index.less
@ -0,0 +1,87 @@
+@import '@/styles/variables.less';
+
+.my-group-job-fragment {
+  position: relative;
+  padding: 20px;
+
+  &__tips-container{
+    width: 100%;
+    height: 100vh;
+    padding-top: 268px;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+
+  &__tips-content {
+    position: relative;
+    width: fit-content;
+    padding: 48px;
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 40px;
+    color: @blColorG1;
+    background: #FFFFFF;
+    border-radius: 16px;
+  }
+
+  &__tips-content-bg {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background: #6D3DF517;
+    border-radius: 16px;
+    transform: rotate(-6deg);
+    transform-origin: 50% bottom;
+    z-index: -1;
+  }
+
+  &__tips-first-panel {
+    margin-bottom: 48px;
+  }
+
+  &__tips-title {
+    position: relative;
+    width: fit-content;
+    font-size: 28px;
+    color: @blColor;
+    margin-bottom: 16px;
+
+    &::after {
+      content: "";
+      height: 10px;
+      background: #6D3DF599;
+      position: absolute;
+      left: 0;
+      right: 0;
+      bottom: 4px;
+    }
+  }
+
+  &__add-group-button {
+    font-size: 28px;
+    line-height: 40px;
+    color: #FFFFFF;
+    background-color: @blHighlightColor;
+    border-radius: 48px;
+    padding: 20px 30px;
+    margin-top: 48px;
+  }
+
+  &__float-add-group-button {
+    position: absolute;
+    right: 24px;
+    bottom: 56px;
+    width: 112px;
+    height: 112px;
+    font-size: 28px;
+    line-height: 112px;
+    white-space: nowrap;
+    border-radius: 50%;
+    color: #FFFFFF;
+    background-color: @blHighlightColor;
+  }
+}
--- a/src/fragments/job/my-group/index.tsx
+++ b/src/fragments/job/my-group/index.tsx
@ -0,0 +1,107 @@
+import { Button } from '@tarojs/components';
+import { NodesRef } from '@tarojs/taro';
+
+import classNames from 'classnames';
+import { useCallback, useEffect, useState } from 'react';
+
+import JobList from '@/components/job-list';
+import ProductGroupDialog from '@/components/product-group-dialog';
+import { APP_TAB_BAR_ID } from '@/constants/app';
+import useListHeight, { IUseListHeightProps } from '@/hooks/use-list-height';
+import { logWithPrefix } from '@/utils/common';
+
+import './index.less';
+
+interface IProps {
+  visible: boolean;
+}
+
+const PREFIX = 'my-group-job-fragment';
+const LIST_CONTAINER_CLASS = 'my-group-job-fragment-list-container';
+const CALC_LIST_PROPS: IUseListHeightProps = {
+  selectors: [`.${LIST_CONTAINER_CLASS}`, `#${APP_TAB_BAR_ID}`],
+  calc: (rects: [NodesRef.BoundingClientRectCallbackResult, NodesRef.BoundingClientRectCallbackResult]) => {
+    const [rect, diffRect] = rects;
+    return diffRect.top - rect.top;
+  },
+};
+const log = logWithPrefix(PREFIX);
+
+const NoGroupTips = (props: { onClick: () => void; className?: string; height?: number }) => {
+  const { className, height, onClick } = props;
+  return (
+    <div className={classNames(`${PREFIX}__tips-container`, className)} style={height ? { height } : undefined}>
+      <div className={`${PREFIX}__tips-content`}>
+        <div className={`${PREFIX}__tips-content-bg`} />
+        <div className={`${PREFIX}__tips-first-panel`}>
+          <div className={`${PREFIX}__tips-title`}>找不到您所在群的通告?</div>
+          <div>点击下方添加群，联系客服</div>
+        </div>
+        <div>
+          <div className={`${PREFIX}__tips-title`}>添加群后，您可以</div>
+          <div>·在播络小程序即可查看群里去重后的所有通告</div>
+          <div>·通过类目、地址等关键信息查找群内通告</div>
+        </div>
+      </div>
+      <Button className={`${PREFIX}__add-group-button`} onClick={onClick}>
+        免费添加群
+      </Button>
+    </div>
+  );
+};
+
+function MyGroup(props: IProps) {
+  const { visible } = props;
+  const listHeight = useListHeight(CALC_LIST_PROPS);
+  const [isEmpty, setIsEmpty] = useState(false);
+  const [dialogVisible, setDialogVisible] = useState(false);
+  log('list height', listHeight);
+
+  const handleListEmpty = useCallback(() => {
+    setIsEmpty(true);
+  }, []);
+
+  const handleAddGroup = useCallback(() => {
+    setDialogVisible(true);
+    // Taro.eventCenter.trigger(EventName.ADD_GROUP);
+  }, []);
+
+  const handleDialogHidden = useCallback(() => {
+    setDialogVisible(false);
+  }, []);
+
+  useEffect(() => {
+    if (visible) {
+      setIsEmpty(false);
+    }
+  }, [visible]);
+
+  const dialog = (
+    <ProductGroupDialog
+      visible={dialogVisible}
+      onClose={handleDialogHidden}
+      style={{ position: 'absolute', top: isEmpty ? '30%' : '40%' }}
+    />
+  );
+
+  if (isEmpty) {
+    return (
+      <>
+        <NoGroupTips className={LIST_CONTAINER_CLASS} height={listHeight} onClick={handleAddGroup} />
+        {dialog}
+      </>
+    );
+  }
+
+  return (
+    <div className={PREFIX}>
+      <JobList visible isOwner className={LIST_CONTAINER_CLASS} listHeight={listHeight} onListEmpty={handleListEmpty} />
+      <Button className={`${PREFIX}__float-add-group-button`} onClick={handleAddGroup}>
+        添加群
+      </Button>
+      {dialog}
+    </div>
+  );
+}
+
+export default MyGroup;