diff --git a/src/assets/images/public/bigScreen/search.png b/src/assets/images/public/bigScreen/search.png new file mode 100644 index 0000000..cad09cf Binary files /dev/null and b/src/assets/images/public/bigScreen/search.png differ diff --git a/src/assets/images/public/bigScreen/topbg.png b/src/assets/images/public/bigScreen/topbg.png new file mode 100644 index 0000000..5526d63 Binary files /dev/null and b/src/assets/images/public/bigScreen/topbg.png differ diff --git a/src/pages/Container/Bi/components/search/index.js b/src/pages/Container/Bi/components/search/index.js new file mode 100644 index 0000000..afe7d63 --- /dev/null +++ b/src/pages/Container/Bi/components/search/index.js @@ -0,0 +1,44 @@ + +import "./index.less"; +import img1 from "~/assets/images/public/bigScreen/topbg.png"; +import img2 from "~/assets/images/public/bigScreen/close.png"; + + + + + +function SearchScreen() { + return ( +
+
+
分公司列表
+
相关方列表
+
+ +
+
+
+
+ +
+
+
+
新益公司
+
快捷登录
+
+
+
新益公司
+
快捷登录
+
+
+
新益公司
+
快捷登录
+
+
+
+ +
+ ); +} + +export default SearchScreen; diff --git a/src/pages/Container/Bi/components/search/index.less b/src/pages/Container/Bi/components/search/index.less new file mode 100644 index 0000000..2a33d7e --- /dev/null +++ b/src/pages/Container/Bi/components/search/index.less @@ -0,0 +1,85 @@ +.search_container{ + width: 214px; + min-height: 200px; + position: absolute; + top: 100px; + left: 400px; + background: rgba(0,41,82,0.68); + border-radius: 4px; + border: 1px solid rgba(44,105,172,0.6); + .top{ + width: 214px; + height: 37px; + background-size: 100% 100%; + display: flex; + padding: 5px; + position: relative; + .list{ + color: #ffffff; + padding: 2px 8px; + cursor: pointer; + &:hover{ + border-radius: 2px; + background-color: rgba(36, 115, 239, 0.549); + box-shadow: 0 1px 1px 0 rgba(2, 32, 95, 0.4); + } + } + .active{ + border-radius: 2px; + background-color: rgba(36, 115, 239, 0.549); + box-shadow: 0 1px 1px 0 rgba(2, 32, 95, 0.4); + } + .close{ + position: absolute; + top: 5px; + right: 10px; + cursor: pointer; + } + } + .search_con{ + background: rgba(5,40,106,0.68); + height: 30px; + border: 1px solid rgba(23,86,168,0.68); + margin:5px; + border-radius: 4px; + color: #4371af; + line-height: 30px; + padding-left: 5px; + font-size: 12px; + .input{ + border: none; + background: none; + width: 100%; + height: 30px; + outline: none; + color: #ffffff; + &::-webkit-input-placeholder{ + color: #4371af; + } + } + + } + .con{ + width: 100%; + + .item{ + width: 100%; + display: flex; + justify-content: space-between; + font-size: 12px; + color: #ffffff; + padding: 5px; + box-sizing: border-box; + border-bottom: 1px dashed #205376; + .btn{ + border-radius: 4px; + background-color: rgba(36, 115, 239, 0.2); + padding:2px 5px; + border: 1px solid rgba(42,86,158,0.58); + cursor: pointer; + + + } + } + } +} diff --git a/src/pages/Container/Bi/index.js b/src/pages/Container/Bi/index.js index 519ea3b..94d6d0b 100644 --- a/src/pages/Container/Bi/index.js +++ b/src/pages/Container/Bi/index.js @@ -4,6 +4,7 @@ import Header from "../Bi/components/Header/index"; import Leftpanel from "~/pages/Container/Bi/components/LeftPanel/index"; import Rightpanel from "~/pages/Container/Bi/components/rightPanel/index"; import Bottom from "~/pages/Container/Bi/components/Bottom/index"; +import Search from "~/pages/Container/Bi/components/search/index"; function BiScreen() { return ( @@ -13,6 +14,7 @@ function BiScreen() { + );