|
@@ -1,4 +1,4 @@
|
|
-import React, { useState } from "react";
|
|
|
|
|
|
+import { useState, useEffect } from "react";
|
|
import Assistant from "./Assistant";
|
|
import Assistant from "./Assistant";
|
|
import data from "@emoji-mart/data";
|
|
import data from "@emoji-mart/data";
|
|
import { init } from "emoji-mart";
|
|
import { init } from "emoji-mart";
|
|
@@ -6,11 +6,31 @@ import styles from "./index.less";
|
|
import "./index.less";
|
|
import "./index.less";
|
|
import logo from "@/assets/shalu-new1.png";
|
|
import logo from "@/assets/shalu-new1.png";
|
|
import { assistantList } from "./data";
|
|
import { assistantList } from "./data";
|
|
|
|
+import { useModel } from "umi";
|
|
|
|
+import { Avatar, Button, Dropdown } from "antd";
|
|
|
|
+import { DownOutlined, UserOutlined } from "@ant-design/icons";
|
|
|
|
|
|
init({ data });
|
|
init({ data });
|
|
|
|
|
|
export default () => {
|
|
export default () => {
|
|
const [active, setActive] = useState(assistantList[0].key);
|
|
const [active, setActive] = useState(assistantList[0].key);
|
|
|
|
+ const { userInfo, handleLogout, checkUserInfo } = useModel("userModel");
|
|
|
|
+
|
|
|
|
+ const handleLogin = () => {
|
|
|
|
+ window.open(
|
|
|
|
+ `/Views/Account/Index.html?ReturnUrl=${window.location.href}`,
|
|
|
|
+ "_self"
|
|
|
|
+ );
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ useEffect(() => {
|
|
|
|
+ checkUserInfo();
|
|
|
|
+ }, []);
|
|
|
|
+
|
|
|
|
+ const handleToManagement = () => {
|
|
|
|
+ window.open(`/Views/Home/Index.html`);
|
|
|
|
+ };
|
|
|
|
+
|
|
return (
|
|
return (
|
|
<div className="flex h-full bg-gray-100 border-t border-gray-200 overflow-hidden">
|
|
<div className="flex h-full bg-gray-100 border-t border-gray-200 overflow-hidden">
|
|
<div className="w-fit sm:w-[216px] shrink-0 pt-6 px-4 border-gray-200 cursor-pointer">
|
|
<div className="w-fit sm:w-[216px] shrink-0 pt-6 px-4 border-gray-200 cursor-pointer">
|
|
@@ -28,9 +48,7 @@ export default () => {
|
|
{assistantList.map((item, index) => (
|
|
{assistantList.map((item, index) => (
|
|
<div
|
|
<div
|
|
key={index}
|
|
key={index}
|
|
- className={
|
|
|
|
- `flex h-8 items-center justify-between mobile:justify-center px-2 mobile:px-1 rounded-lg text-sm font-normal ${active === item.key ? styles.active : " hover:bg-gray-200"}`
|
|
|
|
- }
|
|
|
|
|
|
+ className={`flex h-8 items-center justify-between mobile:justify-center px-2 mobile:px-1 rounded-lg text-sm font-normal ${active === item.key ? styles.active : " hover:bg-gray-200"}`}
|
|
onClick={() => setActive(item.key)}
|
|
onClick={() => setActive(item.key)}
|
|
>
|
|
>
|
|
<div className="flex items-center space-x-2 w-0 grow">
|
|
<div className="flex items-center space-x-2 w-0 grow">
|
|
@@ -38,7 +56,7 @@ export default () => {
|
|
className="flex items-center justify-center relative rounded-lg grow-0 shrink-0 overflow-hidden w-6 h-6 text-base"
|
|
className="flex items-center justify-center relative rounded-lg grow-0 shrink-0 overflow-hidden w-6 h-6 text-base"
|
|
style={{ background: "rgb(213, 245, 246)" }}
|
|
style={{ background: "rgb(213, 245, 246)" }}
|
|
>
|
|
>
|
|
- <img className="w-full h-full" src={item.icon}/>
|
|
|
|
|
|
+ <img className="w-full h-full" src={item.icon} />
|
|
</span>
|
|
</span>
|
|
<div
|
|
<div
|
|
className="overflow-hidden text-ellipsis whitespace-nowrap"
|
|
className="overflow-hidden text-ellipsis whitespace-nowrap"
|
|
@@ -56,15 +74,58 @@ export default () => {
|
|
))}
|
|
))}
|
|
</div>
|
|
</div>
|
|
{/* 用户信息 */}
|
|
{/* 用户信息 */}
|
|
- <div className="w-full h-60px bg-gray-200">
|
|
|
|
-
|
|
|
|
|
|
+ <div className="w-full h-30px">
|
|
|
|
+ {userInfo ? (
|
|
|
|
+ <Dropdown
|
|
|
|
+ menu={{
|
|
|
|
+ items: [
|
|
|
|
+ {
|
|
|
|
+ key: "1",
|
|
|
|
+ label: <span>管理后台</span>,
|
|
|
|
+ onClick: handleToManagement,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: "2",
|
|
|
|
+ label: <span>退出</span>,
|
|
|
|
+ onClick: handleLogout,
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
|
|
+ }}
|
|
|
|
+ trigger={["click"]}
|
|
|
|
+ placement="bottomRight"
|
|
|
|
+ arrow
|
|
|
|
+ >
|
|
|
|
+ <span>
|
|
|
|
+ <Avatar size={32} icon={<UserOutlined />} />
|
|
|
|
+ <span className="ml-4px text-12px text-text-secondary cursor-pointer truncate">
|
|
|
|
+ {userInfo.account}
|
|
|
|
+ </span>
|
|
|
|
+ <DownOutlined className="ml-4px text-12px text-text-secondary" />
|
|
|
|
+ </span>
|
|
|
|
+ </Dropdown>
|
|
|
|
+ ) : (
|
|
|
|
+ <div className="flex items-center gap-12px">
|
|
|
|
+ <Avatar size={32} icon={<UserOutlined />} />
|
|
|
|
+ <Button
|
|
|
|
+ className="ml-4px"
|
|
|
|
+ size="small"
|
|
|
|
+ onClick={handleLogin}
|
|
|
|
+ shape="round"
|
|
|
|
+ >
|
|
|
|
+ 登录
|
|
|
|
+ </Button>
|
|
|
|
+ </div>
|
|
|
|
+ )}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="grow w-0">
|
|
<div className="grow w-0">
|
|
<div className="h-full py-2 pl-0 pr-2 sm:p-2">
|
|
<div className="h-full py-2 pl-0 pr-2 sm:p-2">
|
|
<div className="h-full flex bg-white rounded-2xl shadow-md overflow-hidden false">
|
|
<div className="h-full flex bg-white rounded-2xl shadow-md overflow-hidden false">
|
|
- <Assistant key={active} agent={assistantList.find(item => item.key === active)}/>
|
|
|
|
|
|
+ <Assistant
|
|
|
|
+ key={active}
|
|
|
|
+ agent={assistantList.find((item) => item.key === active)}
|
|
|
|
+ />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|