feat: 生产线管理、生产线明细接口联调

+import { post, get } from '@/utils/request.tsx'
+
+
+/**生产线信息-获取所有生产线信息
+ * **/
+export function getProductLine() {
+    return post(
+        '/open/qx-apaas-lowcode/getProductLine',
+        {
+            select_dcouji: 'ENABLE'
+        },
+        {},
+        {}
+    );
+}
+
+/**生产线信息--获取生产线下所有作业指导书信息
+ * **/
+export function getProductBook(data: {pro_line: string}) {
+    return post(
+        '/open/qx-apaas-lowcode/getProductBook',
+        {
+        },
+        {
+            ...data
+        },
+        {}
+    );
+}
+
+/**获取文件预览地址
+ * **/
+export function getFilePreview(fileId: string) {
+    return get(
+        `/open/qgyun-service-fs-manager/file/p/origin/${fileId}`,
+        {
+        },
+        {
+        }
+    );
+}
\ No newline at end of file

-import React, {useEffect, useState} from 'react'
-import './style.less'
-import NavBar from '@/components/nav-bar'
-import {baseColorPrimary} from "@/utils/common";
-import {hexToRgba} from "@/utils/utils";
-import _mp4 from './mp4.png';
-import _pdf from './pdf.png';
-
-import { useSearchParams } from "react-router-dom";
-
-
-const ProductionList: React.FC = () => {
-    const [title, setTitle] = useState<string>('');
-    // 因是hook，必须写在组件的顶部执行，useSearchParams() 返回的是数组
-    const [params] = useSearchParams();
-    console.log('ProductionList===params', params)
-    // 通过 get 方法获取目标参数
-    const name = params.get("name") || "";
-
-    useEffect(() => {
-        if (name) {
-            setTitle(name)
-        }
-    }, [name])
-
-    const list = [
-        {
-            id: '1',
-            name: '工艺流程指导文件',
-            type: 'pdf'
-        },
-        {
-            id: '2',
-            name: '设备操作指导文件',
-            type: 'mp4'
-        },
-        {
-            id: '3',
-            name: '工艺流程指导文件2',
-            type: 'pdf'
-        },
-        {
-            id: '4',
-            name: '工艺流程指导文件3',
-            type: 'pdf'
-        },
-        {
-            id: '5',
-            name: '工艺流程指导文件4',
-            type: 'pdf'
-        },
-        {
-            id: '6',
-            name: '工艺流程指导文件5',
-            type: 'pdf'
-        },
-        {
-            id: '7',
-            name: '设备操作指导文件2',
-            type: 'mp4'
-        },
-        {
-            id: '8',
-            name: '设备设备设备设备设备设备设备操作指导文件3',
-            type: 'mp4'
-        },
-        {
-            id: '9',
-            name: '设备操作指导文件4',
-            type: 'mp4'
-        },
-        {
-            id: '10',
-            name: '设备操作指导文件5',
-            type: 'mp4'
-        },
-        {
-            id: '11',
-            name: '设备操作指导文件6',
-            type: 'mp4'
-        },
-        {
-            id: '12',
-            name: '设备操作指导文件7',
-            type: 'mp4'
-        },
-        {
-            id: '13',
-            name: '设备操作指导文件8',
-            type: 'mp4'
-        },
-        {
-            id: '14',
-            name: '设备操作指导文件9',
-            type: 'mp4'
-        },
-        {
-            id: '15',
-            name: '设备操作指导文件10',
-            type: 'mp4'
-        }
-    ]
-
-
-    return (
-        <div className={'sxjx-content-main sxjx-layout-main-unfoot'}>
-            <div className={'production-list'}>
-                <NavBar title={title} showBack={true}/>
-                <div className={'production-list_list'}>
-                    {
-                        list?.map((item: any) => {
-                            return  <div
-                                key={item?.id}
-                                className={'production-list_list-item'}
-                                style={{backgroundColor: hexToRgba(baseColorPrimary, 0.6)}}
-                            >
-                                <img className={'production-list_list-item-img'} src={item?.type === 'mp4' ? _mp4 : _pdf}/>
-                                <div className={'omit2 production-list_list-item-name'}>
-                                    {item?.name}
-                                </div>
-                            </div>
-                        })
-                    }
-                </div>
-            </div>
-        </div>
-    )
-}
-
-export default ProductionList;

-import React from 'react'
-import './style.less'
-import NavBar from "@/components/nav-bar"
-import {baseColorPrimary} from "@/utils/common";
-import {hexToRgba} from "@/utils/utils";
-import { useNavigate } from "react-router-dom";
-
-
-const ProductionManagement: React.FC = () => {
-    const navigate = useNavigate();
-
-    const list = [
-        {
-            id: '1',
-            name: '车顶生产线A'
-        },
-        {
-            id: '2',
-            name: '车顶生产线B'
-        },
-        {
-            id: '3',
-            name: '车顶生产线C'
-        },
-        {
-            id: '4',
-            name: '车顶生产线D'
-        },
-        {
-            id: '5',
-            name: '车顶生产线E'
-        },
-        {
-            id: '6',
-            name: '车顶生产线F'
-        },
-        {
-            id: '7',
-            name: '车顶生产线G'
-        },
-        {
-            id: '8',
-            name: '车顶生产线H'
-        },
-        {
-            id: '9',
-            name: '车顶生产线I'
-        },
-        {
-            id: '10',
-            name: '车顶生产线J'
-        },
-        {
-            id: '11',
-            name: '车顶生产线K'
-        },
-        {
-            id: '12',
-            name: '车顶生车顶生车顶生产线L'
-        },
-        {
-            id: '13',
-            name: '车顶生产线M'
-        },
-        {
-            id: '14',
-            name: '车顶生产线N'
-        }
-    ];
-
-    const toProductionList = (item: any) => {
-        console.log('toProductionList-item', item)
-        navigate(`/production/list?id=${item?.id}&name=${item?.name}`);
-    }
-
-
-    return (
-        <div className={'sxjx-content-main sxjx-layout-main-unfoot'}>
-            <div className={'production-management'}>
-                <NavBar title={'生产线管理'}/>
-                <div className={'production-management_list'}>
-                    {
-                        list?.map((item: any) => {
-                            return  <div
-                                key={item?.id}
-                                className={'production-management_list-item'}
-                                style={{backgroundColor: hexToRgba(baseColorPrimary, 0.6)}}
-                                onClick={() => toProductionList(item)}
-                            >
-                                {item?.name}
-                            </div>
-                        })
-                    }
-                </div>
-            </div>
-        </div>
-    )
-}
-
-export default ProductionManagement;

+import React, {useEffect, useState} from 'react'
+import './style.less'
+import NavBar from '@/components/nav-bar'
+import {baseColorPrimary} from "@/utils/common";
+import {hexToRgba} from "@/utils/utils";
+import _mp4 from './mp4.png';
+import _pdf from './pdf.png';
+
+import {useSearchParams} from "react-router-dom";
+import {getProductBook} from "@/api/apiConfig";
+import {SpinLoading} from 'antd-mobile'
+
+interface ListType {
+    id: string;
+    name: string;
+    type: 'pdf' | 'mp4' | string
+}
+
+const ProductionList: React.FC = () => {
+    const [title, setTitle] = useState<string>('');
+    const [list, setList] = useState<ListType[]>([]);
+    const [show, setShow] = useState<boolean>(false);
+
+
+    // 因是hook，必须写在组件的顶部执行，useSearchParams() 返回的是数组
+    const [params] = useSearchParams();
+    console.log('ProductionList===params', params)
+    // 通过 get 方法获取目标参数
+    const name = params.get("name") || "";
+    const id = params.get("id") || "";
+
+    useEffect(() => {
+        if (name) {
+            setTitle(name)
+        }
+    }, [name])
+
+    useEffect(() => {
+        if (id) {
+            setShow(false);
+            getProductBook({pro_line: id}).then((res: any) => {
+                setShow(true);
+                const _list = res?.product_book?.map((item: any) => {
+                    const _arr = item?.guide_book_file_info_?.[0]?.name?.split('.') || [];
+                    return {
+                        id: item?.id || '',
+                        name: _arr?.[0] || '',
+                        type: _arr?.[1] || '',
+                    }
+                }) || [];
+                setList(_list)
+            }).catch((e: any) => {
+                setShow(true);
+                setList([])
+            })
+        }
+    }, [id])
+
+
+    return (
+        <div className={'sxjx-content-main sxjx-layout-main-unfoot'}>
+            <div className={'production-list'}>
+                <NavBar title={title} showBack={true}/>
+                {
+                    !show ? <SpinLoading color='primary'/> :
+                        <div className={'production-list_list'}>
+                            {
+                                list?.map((item: any) => {
+                                    return <div
+                                        key={item?.id}
+                                        className={'production-list_list-item'}
+                                        style={{backgroundColor: hexToRgba(baseColorPrimary, 0.55)}}
+                                    >
+                                        <img className={'production-list_list-item-img'}
+                                             src={item?.type === 'mp4' ? _mp4 : _pdf}/>
+                                        <div className={'omit2 production-list_list-item-name'}>
+                                            {item?.name}
+                                        </div>
+                                    </div>
+                                })
+                            }
+
+                        </div>
+                }
+            </div>
+        </div>
+    )
+}
+
+export default ProductionList;

 .production-list {
   background: #f7f7f7;
 
+  .adm-spin-loading {
+    --size: 60px;
+    margin: 300px auto 0;
+  }
+
   &_list {
     padding: 60px;
     display: flex;

+import React, {useEffect, useState} from 'react'
+import './style.less'
+import NavBar from "@/components/nav-bar"
+import {baseColorPrimary} from "@/utils/common";
+import {hexToRgba} from "@/utils/utils";
+import { useNavigate } from "react-router-dom";
+import {getProductLine} from "@/api/apiConfig";
+import { SpinLoading } from 'antd-mobile'
+
+interface ListType {
+    id: string;
+    name: string;
+}
+
+const ProductionManagement: React.FC = () => {
+    const navigate = useNavigate();
+    const [list, setList] = useState<ListType[]>([]);
+    const [show, setShow] = useState<boolean>(false);
+
+    useEffect(() => {
+        setShow(false);
+        getProductLine().then((res: any) => {
+            setShow(true);
+            const _list = res?.product_line?.map((item: any) => {
+                return {
+                    id: item?.id || '',
+                    name: item?.name || '',
+                }
+            }) || [];
+            setList(_list)
+
+        }).catch((e: any) => {
+            setShow(true);
+            setList([])
+        })
+    }, [])
+
+    const toProductionList = (item: any) => {
+        console.log('toProductionList-item', item)
+        navigate(`/production/list?id=${item?.id}&name=${item?.name}`);
+    }
+
+
+    return (
+        <div className={'sxjx-content-main sxjx-layout-main-unfoot'}>
+            <div className={'production-management'}>
+                <NavBar title={'生产线管理'}/>
+                {
+                    !show ? <SpinLoading color='primary' /> :
+                        <div className={'production-management_list'}>
+                            {
+                                list?.map((item: any) => {
+                                    return  <div
+                                        key={item?.id}
+                                        className={'production-management_list-item'}
+                                        style={{backgroundColor: hexToRgba(baseColorPrimary, 0.6)}}
+                                        onClick={() => toProductionList(item)}
+                                    >
+                                        {item?.name}
+                                    </div>
+                                })
+                            }
+                        </div>
+                }
+
+            </div>
+        </div>
+    )
+}
+
+export default ProductionManagement;

 .production-management {
   background: #f7f7f7;
 
+  .adm-spin-loading {
+    --size: 60px;
+    margin: 300px auto 0;
+  }
+
   &_list {
     padding: 60px;
     display: flex;

 import {createHashRouter} from 'react-router-dom';
 import ErrorPage from "./pages/errorPage";
-import ProductionManagement from "./pages/production-management";
-import ProductionList from "./pages/production-list";
-import ProductionDetail from "./pages/production-detail";
+import ProductionManagement from "./pages/production/management";
+import ProductionList from "./pages/production/list";
+import ProductionDetail from "./pages/production/detail";
 
 
 const routers = [

@@ -25,7 +25,8 @@
     "baseUrl": ".",
     "paths": {
       "@/*": ["src/*"]
-    }
+    },
+    "allowSyntheticDefaultImports": true
   },
   "include": ["src"]
 }