diff --git a/config/dev.js b/config/dev.js index add4171..12865cb 100644 --- a/config/dev.js +++ b/config/dev.js @@ -9,8 +9,8 @@ module.exports = { mini: {}, h5: { devServer: { - // host: '0.0.0.0', - host: '192.168.3.102', + host: '0.0.0.0', + // host: '192.168.3.102', port: 10086, // 设置代理来解决 H5 请求的跨域问题 proxy: { diff --git a/src/assets/icon/coin-2.svg b/src/assets/icon/coin-2.svg new file mode 100644 index 0000000..4459acc --- /dev/null +++ b/src/assets/icon/coin-2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/card.jsx b/src/components/card.jsx index c1a15d9..35e6abe 100644 --- a/src/components/card.jsx +++ b/src/components/card.jsx @@ -16,8 +16,19 @@ function Card(props) { return ( - {dots[dot || 0]} - + + {dots[dot || 0]} + + + + ) } diff --git a/src/components/style/card.scss b/src/components/style/card.scss index 0e24265..80d75cc 100644 --- a/src/components/style/card.scss +++ b/src/components/style/card.scss @@ -9,7 +9,7 @@ .dot { position: absolute; - font-size: 14px; + // font-size: 14px; left: 6px; top: 2px; font-weight: bold; diff --git a/src/pages/table/table.jsx b/src/pages/table/table.jsx index e08405b..9006ba4 100644 --- a/src/pages/table/table.jsx +++ b/src/pages/table/table.jsx @@ -1,5 +1,5 @@ import React, { Component, useState } from 'react' -import { View, Text, Image } from '@tarojs/components' +import { View, Text, Image, Input, Button } from '@tarojs/components' import { useSelector } from 'react-redux' import cnames from 'classnames' @@ -7,6 +7,7 @@ import './table.scss' import Title from '@/components/title' import Card from '@/components/card' import coinIcon from '@/assets/icon/coin-1.svg' +import coin2Icon from '@/assets/icon/coin-2.svg' function Table() { @@ -51,6 +52,59 @@ function Table() { )) } + + + + { + [1,2,3,4,5].map((item, i) => ( + + )) + } + + + + + POT + + 22,088,000 + + + + + Kelly(#1)进入了游戏 + Apollo(#2)进入了游戏 + + + + + + + + + + + + + + { + [1,2,3,4,5].map((_, i) => ( + + )) + } + + + + Prometheus + + + + + 3,000,000 + + 0% + + + ) } diff --git a/src/pages/table/table.scss b/src/pages/table/table.scss index a5bda56..3232dfb 100644 --- a/src/pages/table/table.scss +++ b/src/pages/table/table.scss @@ -108,4 +108,170 @@ color: #fff; margin-left: 5px; } + + .desktop-box { + display: flex; + justify-content: space-between; + flex-wrap: nowrap; + margin: 33px 26px 0 26px; + } + .desktop-wrap { + + } + .desktop-cards { + width: 250px; + height: 95px; + border-radius: 5px; + background-color: #584D4D; + display: flex; + justify-content: space-evenly; + align-items: center; + flex-wrap: nowrap; + } + .desktop-wallet { + margin-top: 4px; + width: 250px; + height: 36px; + background-color: #EE914E; + border-radius: 5px; + display: flex; + justify-content: space-between; + box-sizing: border-box; + padding: 0 5px; + } + .d-wallet-icon { + font-size: 18px; + color: #fff; + font-weight: bold; + line-height: 36px; + display: flex; + align-items: center; + } + .d-wallet-icon-img { + height: 28px; + width: 28px; + } + .d-wallet-icon-text { + margin-left: 7px; + } + .d-wallet-amount { + font-size: 18px; + color: #fff; + font-weight: bold; + line-height: 36px; + } + .chatbox { + width: 159px; + height: 134px; + border: 1px solid #000; + border-radius: 5px; + padding: 5px; + } + .chat-window { + + .line { + font-size: 10px; + line-height: 12px; + } + } + .chat-panel { + + } + + .self-box { + // width: 100%; + height: 109px; + background-color: #EE914E; + margin: 30px 26px 0 26px; + border-radius: 5px;; + } + .self-wrap { + position: relative; + } + .s-info-wrap { + display: flex; + height: 89px; + } + .s-avatar { + align-self: center; + margin-left: 6px; + } + .s-avatar-img { + width: 65px; + height: 65px; + } + .s-username { + font-size: 12px; + font-weight: bold; + border-bottom: 1px solid #fff; + color: #fff; + height: 26px; + align-self: flex-end; + margin-bottom: 16px; + margin-left: 10px; + } + .s-wallet-wrap { + display: flex; + width: 156px; + } + .s-w-amount-wrap { + width: 97px; + height: 18px; + background-color: #fff; + margin-left: 4px; + border-radius: 5px; + display: flex; + justify-content: space-between; + // align-items: flex-start; + box-sizing: border-box; + padding: 0 5px 0 3px; + } + .s-w-amount-icon { + width: 14px; + height: 14px; + margin-top: -2px; + } + .s-w-amount-icon-img { + width: 15px; + height: 15px; + } + .s-w-amount { + color: #3D3D3D; + font-size: 12px; + line-height: 18px; + } + .s-w-pct { + width: 50px; + height: 18px; + border-radius: 5px; + font-size: 12px; + line-height: 18px; + color: #3D3D3D; + text-align: center; + background-color: #fff; + margin-left: 8px; + } + .hand-card1,.hand-card2 { + position: absolute; + top: -20px; + left: 80px; + } + .hand-card2 { + left: 126px; + } + .hand-five { + position: absolute; + left: 188px; + top: -10px; + z-index: 999; + width: 166px; + height: 46px; + align-items: center; + display: flex; + justify-content: space-evenly; + // background-color: #807878; + } + .hand-five-item { + + } }