fix: mobile5 select color

alitajs · Sep 20, 2023 · b5004bd · b5004bd
1 parent 78d0523
commit b5004bd
Show file tree

Hide file tree

Showing 7 changed files with 75 additions and 10 deletions.
diff --git a/.changeset/friendly-planets-hug.md b/.changeset/friendly-planets-hug.md
@@ -0,0 +1,5 @@
+---
+'@alita/plugins': patch
+---
+
+fix: mobile5 select color
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -0,0 +1,57 @@
+name: Deploy CI
+
+env:
+  NODE_OPTIONS: --max-old-space-size=6144
+
+on:
+  push:
+    branches:
+      - master
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install pnpm
+        uses: pnpm/[email protected]
+        with:
+          run_install: false
+
+      - name: Get pnpm store directory
+        id: pnpm-cache
+        run: |
+          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+
+      - name: Setup pnpm cache
+        uses: actions/cache@v3
+        with:
+          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Install dependencies
+        run: pnpm i
+
+      - name: Build
+        run: pnpm doc:build
+
+      - name: Deploy
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./dist
diff --git a/.workflow/branch-pipeline.yml b/.workflow/branch-pipeline.yml
@@ -2,7 +2,7 @@ version: '1.0'
 name: branch-pipeline
 displayName: BranchPipeline
 stages:
-  - stage: 
+  - stage:
     name: compile
     displayName: 编译
     steps:
@@ -16,7 +16,7 @@ stages:
           - npm install && rm -rf ./dist && npm run build
         # 非必填字段，开启后表示将构建产物暂存，但不会上传到制品库中，7天后自动清除
         artifacts:
-            # 构建产物名字，作为产物的唯一标识可向下传递，支持自定义，默认为BUILD_ARTIFACT。在下游可以通过${BUILD_ARTIFACT}方式引用来获取构建物地址
+          # 构建产物名字，作为产物的唯一标识可向下传递，支持自定义，默认为BUILD_ARTIFACT。在下游可以通过${BUILD_ARTIFACT}方式引用来获取构建物地址
           - name: BUILD_ARTIFACT
             # 构建产物获取路径，是指代码编译完毕之后构建物的所在路径
             path:
@@ -29,7 +29,7 @@ stages:
         # 上传到制品库时的制品命名，默认output
         artifactName: output
         dependsOn: build_nodejs
-  - stage: 
+  - stage:
     name: release
     displayName: 发布
     steps:

diff --git a/.workflow/pr-pipeline.yml b/.workflow/pr-pipeline.yml
@@ -2,7 +2,7 @@ version: '1.0'
 name: pr-pipeline
 displayName: PRPipeline
 stages:
-  - stage: 
+  - stage:
     name: compile
     displayName: 编译
     steps:
@@ -16,7 +16,7 @@ stages:
           - npm install && rm -rf ./dist && npm run build
         # 非必填字段，开启后表示将构建产物暂存，但不会上传到制品库中，7天后自动清除
         artifacts:
-            # 构建产物名字，作为产物的唯一标识可向下传递，支持自定义，默认为BUILD_ARTIFACT。在下游可以通过${BUILD_ARTIFACT}方式引用来获取构建物地址
+          # 构建产物名字，作为产物的唯一标识可向下传递，支持自定义，默认为BUILD_ARTIFACT。在下游可以通过${BUILD_ARTIFACT}方式引用来获取构建物地址
           - name: BUILD_ARTIFACT
             # 构建产物获取路径，是指代码编译完毕之后构建物的所在路径
             path:

diff --git a/examples/mobile5/src/app.tsx b/examples/mobile5/src/app.tsx
@@ -91,8 +91,7 @@ const tabList: TabBarListItem[] = [
 const tabBar: TabBarProps = {
   color: `#999999`,
   selectedColor: '#00A0FF',
-  borderStyle: 'white',
-  position: 'bottom',
+  backgroundColor: '#FFF',
   list: tabList,
 };
 

diff --git a/packages/plugins/templates/mobile-layout/layout.tpl b/packages/plugins/templates/mobile-layout/layout.tpl
@@ -77,6 +77,7 @@ export interface TabBarProps {
   color?: string;
   selectedColor?: string;
   backgroungColor?: string;
+  backgroundColor?: string;
   position?: 'bottom' | 'top';
   borderStyle?: string;
   tabsGroup?: string[][];
@@ -239,6 +240,7 @@ const AlitaLayout: FC<AlitaLayoutProps> = ({
     color,
     selectedColor,
     backgroungColor = '#FFF',
+    backgroundColor,
     position,
     tabsGroup = [],
   } = tabBar as TabBarProps;
@@ -300,7 +302,7 @@ const AlitaLayout: FC<AlitaLayoutProps> = ({
             tabBarPosition={position}
             unselectedTintColor={color}
             tintColor={selectedColor}
-            barTintColor={backgroungColor}
+            barTintColor={backgroundColor || backgroungColor}
             noRenderContent
           >
             {realList.map(item => {

diff --git a/packages/plugins/templates/mobile-layout/layout5.tpl b/packages/plugins/templates/mobile-layout/layout5.tpl
@@ -77,6 +77,7 @@ export interface TabBarProps {
     color?: string;
     selectedColor?: string;
     backgroungColor?: string;
+    backgroundColor?: string;
     position?: 'bottom' | 'top';
     borderStyle?: string;
     tabsGroup?: string[][];
@@ -244,6 +245,7 @@ const AlitaLayout: FC<AlitaLayoutProps> = ({
         color,
         selectedColor,
         backgroungColor = '#FFF',
+        backgroundColor,
         position,
         tabsGroup = [],
     } = tabBar as TabBarProps;
@@ -298,8 +300,8 @@ const AlitaLayout: FC<AlitaLayoutProps> = ({
                         tabBarPosition={position}
                         unselectedTintColor={color}
                         tintColor={selectedColor}
-                        barTintColor={backgroungColor}
-                        style={ { backgroungColor:backgroungColor }}
+                        barTintColor={backgroundColor || backgroungColor}
+                        style={ { backgroundColor:backgroundColor || backgroungColor, '--adm-color-primary': selectedColor, '--adm-color-text-secondary': color}}
                         safeArea={true}
                         activeKey={pathname}
                         onChange={value => {