From 258731211a690da8cc3713a060ca6c131ddc99fa Mon Sep 17 00:00:00 2001
From: bbb169 <827088092@qq.com>
Date: Wed, 18 Oct 2023 22:56:16 +0800
Subject: [PATCH] fix: resolve circular dependencies

---
 .../component/cardsTypeCompareGuide/index.tsx |  2 +-
 .../component/customFloatButton/index.tsx     | 12 +++------
 src/pages/playRoom/styles/playRoom.ts         |  9 +++++++
 src/utils/const.ts                            | 25 +++++++++++++++++
 src/utils/tanslate.ts                         | 27 +------------------
 5 files changed, 39 insertions(+), 36 deletions(-)
 create mode 100644 src/utils/const.ts

diff --git a/src/pages/playRoom/component/cardsTypeCompareGuide/index.tsx b/src/pages/playRoom/component/cardsTypeCompareGuide/index.tsx
index 2127e44..679c309 100644
--- a/src/pages/playRoom/component/cardsTypeCompareGuide/index.tsx
+++ b/src/pages/playRoom/component/cardsTypeCompareGuide/index.tsx
@@ -1,4 +1,3 @@
-import { translateStringToCard } from '@/utils/tanslate.js';
 import { css } from '@emotion/react';
 import { Tabs } from 'antd';
 import { useState } from 'react';
@@ -6,6 +5,7 @@ import { CardType } from '../../type.js';
 import DemoCards from '../demoCards/index.js';
 import styled from '@emotion/styled';
 import { customScrollBar } from '@/styles/scrollbar.js';
+import { translateStringToCard } from '@/utils/const.js';
 
 const getCards = (isShortCards = false): [string, CardType[]][] => {
     const diffCardsStr: [string, string[]][] = [
diff --git a/src/pages/playRoom/component/customFloatButton/index.tsx b/src/pages/playRoom/component/customFloatButton/index.tsx
index 7a8e892..3f50244 100644
--- a/src/pages/playRoom/component/customFloatButton/index.tsx
+++ b/src/pages/playRoom/component/customFloatButton/index.tsx
@@ -1,20 +1,14 @@
 import { Button, Popconfirm } from 'antd';
 import { LeftOutlined, QuestionOutlined } from '@ant-design/icons';
 import { useNavigate } from 'react-router-dom';
-import { css } from '@emotion/react';
 import CardsTypeCompareGuide from '../cardsTypeCompareGuide/index.js';
 import introJs from 'intro.js';
 import 'intro.js/introjs.css';
+import { getFloatCss } from '../../styles/playRoom.js';
+// import AudioButton from '../audioButton/index.js';
 
 const Introduct = introJs as unknown as () => { start: () => void };
 
-const getFloatCss = (isRight = false) => css`
-  position: absolute;
-  top: 2vh;
-  ${isRight ? 'right' : 'left'}: 4vw;
-  z-index: 999;
-`;
-
 export function CustomFloatButton () {
     const navigate = useNavigate();
     
@@ -46,6 +40,6 @@ export function CustomFloatButton () {
                 shape='circle'
             />
         </Popconfirm>
-        
+        {/* <AudioButton /> */}
     </>;
 }
\ No newline at end of file
diff --git a/src/pages/playRoom/styles/playRoom.ts b/src/pages/playRoom/styles/playRoom.ts
index 45cfec2..fb8837d 100644
--- a/src/pages/playRoom/styles/playRoom.ts
+++ b/src/pages/playRoom/styles/playRoom.ts
@@ -39,4 +39,13 @@ export const CardsFlexBoxDiv = styled.div`
   margin-bottom: 20px;
   padding-right: calc(100px - 80%/5);
   color: black;
+`;
+
+// ========================= float buttons ===============
+
+export const getFloatCss = (isRight = false, top = 2) => css`
+  position: absolute;
+  top: ${top}vh;
+  ${isRight ? 'right' : 'left'}: 4vw;
+  z-index: 999;
 `;
\ No newline at end of file
diff --git a/src/utils/const.ts b/src/utils/const.ts
new file mode 100644
index 0000000..c3c8939
--- /dev/null
+++ b/src/utils/const.ts
@@ -0,0 +1,25 @@
+/* eslint-disable id-length */
+import { privateKey } from '@/const.js';
+import { CardColor, CardType } from '@/pages/playRoom/type.js';
+import { AES } from 'crypto-js';
+
+
+const suitMap: { [key: string]: CardColor} = {
+    h:'hearts', 
+    d:'diamonds', 
+    c:'clubs', 
+    s:'spades',
+};
+
+export function translateStringToCard (str: string): CardType {
+    const rank = str.slice(0, str.length - 1);
+    const suit = suitMap[str[str.length - 1]];
+
+    return {
+        key: AES.encrypt(suit + rank, privateKey).toString(),
+        color: suit,
+        number: rank,
+        showFace: 'front',
+        statu: 'undistributed',
+    };
+}
\ No newline at end of file
diff --git a/src/utils/tanslate.ts b/src/utils/tanslate.ts
index df7bb96..5c15058 100644
--- a/src/utils/tanslate.ts
+++ b/src/utils/tanslate.ts
@@ -1,8 +1,3 @@
-/* eslint-disable id-length */
-import { privateKey } from '@/const.js';
-import { CardColor, CardType } from '@/pages/playRoom/type.js';
-import { AES } from 'crypto-js';
-
 export const cardTypeTranslateMap = {
     'Straight Flush': '同花顺', 
     'Four of a Kind': '四条（金刚）', 
@@ -13,24 +8,4 @@ export const cardTypeTranslateMap = {
     'Two Pair': '两对', 
     Pair: '一对', 
     'High Card': '高牌',
-};
-
-const suitMap: { [key: string]: CardColor} = {
-    h:'hearts', 
-    d:'diamonds', 
-    c:'clubs', 
-    s:'spades',
-};
-
-export function translateStringToCard (str: string): CardType {
-    const rank = str.slice(0, str.length - 1);
-    const suit = suitMap[str[str.length - 1]];
-
-    return {
-        key: AES.encrypt(suit + rank, privateKey).toString(),
-        color: suit,
-        number: rank,
-        showFace: 'front',
-        statu: 'undistributed',
-    };
-}
\ No newline at end of file
+};
\ No newline at end of file