fix(多租户): 资产信息

多租户资产信息优化
 更改默认图标
 编辑/添加资产后刷新界面
 修改添加按钮样式
 资产数量更新
 成员管理资产查看

src/pages/system/tenant/components/assets/device/index.tsx

@@ -8,8 +8,10 @@ import Edit from "./edit";
 import { TenantContext } from "../../../detail";
 import Service from "../../../service";
 
-
-const Device = () => {
+interface Props {
+    user: any
+}
+const Device = (props: Props) => {
     const [visible, setVisible] = useState<boolean>(false);
     const data = useContext(TenantContext);
     const service = new Service('tenant');
@@ -22,7 +24,7 @@ const Device = () => {
                 id$assets: JSON.stringify({
                     tenantId: data?.id,
                     assetType: 'device',
-
+                    memberId: props.user,
                 }),
                 state: 'notActive'
             }
@@ -34,7 +36,7 @@ const Device = () => {
                 id$assets: JSON.stringify({
                     tenantId: data?.id,
                     assetType: 'device',
-
+                    memberId: props.user,
                 }),
                 state: 'active'
             }
@@ -44,7 +46,7 @@ const Device = () => {
     }
     useEffect(() => {
         getData();
-    }, []);
+    }, [props.user]);
 
     return (
         <List.Item style={{ paddingRight: '10px' }}>

src/pages/system/tenant/components/assets/index.tsx

@@ -1,28 +1,60 @@
-import React from "react";
-import { List, Input } from "antd";
+import React, { useEffect, useState } from "react";
+import { List, Input, Select } from "antd";
+import encodeQueryParam from "@/utils/encodeParam";
 import styles from './index.less';
 import Product from "./product";
 import Device from "./device";
-import IconFont from "@/components/IconFont";
-
-const Assets = () => (
-    <div>
-        {/* <div style={{ marginBottom: 50, marginTop: 20 }}>
-            <Input.Search />
-        </div> */}
-
-        <div className={styles.cardList}>
-
-            <List<Partial<any>>
-                rowKey="id"
-                loading={false}
-                grid={{ gutter: 24, lg: 4, md: 2, sm: 1, xs: 1 }}
-            >
-
-                <Product />
-                <Device />
-            </List>
-        </div>
-    </div >
-)
+import Service from "../../service";
+
+interface Props {
+    data: any;
+    user?: any;
+}
+const Assets = (props: Props) => {
+    const service = new Service('tenant');
+
+    const { data: { id }, user } = props;
+
+    const [userList, setUserList] = useState([]);
+    const [current, setCurrent] = useState();
+    useEffect(() => {
+        service.member.query(id, encodeQueryParam({})).subscribe(resp => {
+            const temp = resp.data.map((item: any) => ({
+                id: item.userId,
+                name: item.name
+            }));
+            setUserList(temp);
+        });
+        if (user) {
+            setCurrent(user.userId);
+        }
+    }, [user?.userId]);
+    return (
+
+
+        <div>
+            <div style={{ marginBottom: 20, marginTop: 20 }}>
+                <Select
+                    style={{ width: '100%' }}
+                    value={current}
+                    onChange={(e: any) => setCurrent(e)}>
+                    {userList.map((item: any) => <Select.Option key={item.id} value={item.id}>{item.name}</Select.Option>)}
+                </Select>
+            </div>
+
+            <div className={styles.cardList}>
+
+                <List<Partial<any>>
+                    rowKey="id"
+                    loading={false}
+                    grid={{ gutter: 24, lg: 4, md: 2, sm: 1, xs: 1 }}
+                >
+
+                    <Product user={current} />
+                    <Device user={current} />
+                </List>
+            </div>
+        </div >
+    )
+}
 export default Assets;

src/pages/system/tenant/components/assets/product/index.tsx

@@ -8,7 +8,10 @@ import Edit from "./edit";
 import { TenantContext } from "../../../detail";
 import Service from "../../../service";
 
-const Product = () => {
+interface Props {
+    user: any
+}
+const Product = (props: Props) => {
     const [visible, setVisible] = useState<boolean>(false);
     const data = useContext(TenantContext);
 
@@ -24,7 +27,7 @@ const Product = () => {
                 id$assets: JSON.stringify({
                     tenantId: data?.id,
                     assetType: 'product',
-
+                    memberId: props.user,
                 }),
                 state: 1
             }
@@ -36,7 +39,7 @@ const Product = () => {
                 id$assets: JSON.stringify({
                     tenantId: data?.id,
                     assetType: 'product',
-
+                    memberId: props.user,
                 }),
                 state: 0
             }
@@ -46,7 +49,7 @@ const Product = () => {
     }
     useEffect(() => {
         getData();
-    }, [])
+    }, [props.user])
     return (
         <List.Item style={{ paddingRight: '10px' }}>
             <Card

src/pages/system/tenant/components/member/index.tsx

@@ -1,7 +1,7 @@
 import React, { Fragment, useState, useEffect } from "react";
 import ProTable from "@/pages/system/permission/component/ProTable";
 import { ColumnProps } from "antd/lib/table";
-import { Button, Tag, message, Popconfirm } from "antd";
+import { Button, Tag, message, Popconfirm, Divider } from "antd";
 import SearchForm from "@/components/SearchForm";
 import encodeQueryParam from "@/utils/encodeParam";
 import { ListData } from "@/services/response";
@@ -10,7 +10,8 @@ import { TenantItem } from "../../data";
 import Service from "../../service";
 
 interface Props {
-    data: Partial<TenantItem>
+    data: Partial<TenantItem>;
+    openAssets: Function;
 }
 const Member = (props: Props) => {
     const service = new Service('tenant');
@@ -64,15 +65,14 @@ const Member = (props: Props) => {
             align: 'center',
             render: (record: any) => (
                 <Fragment>
-                    {/* <a
+                    <a
                         onClick={() => {
+                            props.openAssets(record);
                         }}
                     >
                         查看资产
                     </a>
                     <Divider type="vertical" />
-                    <a>禁用</a>
-                    <Divider type="vertical" /> */}
                     <Popconfirm title="确认解绑吗？" onConfirm={() => unBind(record)}>
                         <a >解绑</a>
                     </Popconfirm>

src/pages/system/tenant/detail/index.tsx

@@ -22,25 +22,29 @@ const Detail = (props: Props) => {
         if (pathname.indexOf('detail') > 0) {
             const list = pathname.split('/');
             service.queryById(list[list.length - 1]).subscribe(d => {
-                console.log(d);
                 setData(d);
             });
         }
     }, []);
 
+    const [key, setKey] = useState<string>('basicinfo');
+    const [user, setUser] = useState();
     return (
         <PageHeaderWrapper title="租户管理">
             <Card>
                 <TenantContext.Provider value={data}>
-                    <Tabs defaultActiveKey="1" >
+                    <Tabs activeKey={key} onChange={k => setKey(k)} >
                         <Tabs.TabPane tab="基本信息" key="basicinfo">
                             <BasicInfo data={data} />
                         </Tabs.TabPane>
                         <Tabs.TabPane tab="资产信息" key="assets">
-                            <Assets data={data} />
+                            <Assets data={data} user={user} />
                         </Tabs.TabPane>
                         <Tabs.TabPane tab="成员管理" key="member">
-                            <Member data={data} />
+                            <Member data={data} openAssets={(item: any) => {
+                                setKey('assets');
+                                setUser(item);
+                            }} />
                         </Tabs.TabPane>
                         <Tabs.TabPane tab="查看权限" key="permission">
                             <Permission data={data} />