@extends('layouts.frontend-member')
@section('title', __('message.my account'))
@section('content')

    <div class="container-fluid " style="padding:0px;width:100vw;">
        <div class="no_header">
            <div class="fl allhg txtl">
                <i class="bi bi-arrow-left fcc fw pointer" onclick="goback()" style="font-size: 24px;"></i>
            </div>

            <div class="fl allhg" id="centerbox" style="width:80%;text-align:center;line-height:50px;">
                <span class="fcc fzmmm">กองทุน</span>
            </div>

            <a href="#">
                <div class="fr allhg txtr" style="line-height:50px;width:10%;">
                    <svg t="1656750606237" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        p-id="4326" width="20" height="20">
                        <path
                            d="M914.9 158.4H183.5c-15.2 0-27.6-12.4-27.6-27.6v-4.1c0-15.2 12.4-27.6 27.6-27.6h731.4c15.2 0 27.6 12.4 27.6 27.6v4.1c0.1 15.2-12.3 27.6-27.6 27.6zM914.9 819.9H183.5c-15.2 0-27.6-12.4-27.6-27.6v-4.1c0-15.2 12.4-27.6 27.6-27.6h731.4c15.2 0 27.6 12.4 27.6 27.6v4.1c0.1 15.2-12.3 27.6-27.6 27.6zM574.7 489.2H176.6c-11.4 0-20.7-9.3-20.7-20.7v-18.1c0-11.4 9.3-20.7 20.7-20.7h398.1c11.4 0 20.7 9.3 20.7 20.7v18.1c0 11.4-9.3 20.7-20.7 20.7z"
                            fill="#00b897" p-id="4327"></path>
                    </svg>
                </div>
            </a>
        </div>

        <div class="oreimgbox">

            <div class="fl col-8 pl20 pt20">
                <!--<p class="fe6im ti12 f12">รางวัลจากการขุดทันที</p>-->
                <p class="fe6im ti12 f12">จำนวนเงินลงทุนทั้งหมด ：</p>
                <p class="fe6im ti12 f12">รายได้รวมสะสม：</p>
            </div>
            <div class="fr  col-4">
                <img src="{{ asset('fronts/home/Static/img/imxmoney.png') }}" class="d-block" style="width:170px;float: right;">
            </div>
        </div>
        {{-- Tabs --}}
        <div class="oplist">
            <div class="listbox hsborder pointer" id="zlbtn" onclick="Allfun()" >
                <span class="fzmm fcy" id="zlbtn_span" style="color: rgb(0, 184, 151);">กองทุนทั้งหมด</span>
            </div>
           
            <div class="emptybox"></div>
            <div class="listbox pointer" id="myorebtn" onclick="myFun()">
                <span class="fzmm fcc" id="myorebtn_span" style="color: rgb(112, 122, 138);">กองทุนของฉัน</span>
            </div>
        </div>
        


        <!--全部矿机-->
        <div id="zlbox"
            style="width: 100%; min-height: 600px; background: rgb(255, 255, 255); padding: 10px 0px; display: block;">
            <div class="orebox">
            
            </div>
            <div class="orebox">
                <div style="width:100%;height:120px;">
                    <div style="width:30%;height:120px;float:left;text-align: center;margin-top: -20px;">
                        <img src="{{ asset('fronts/home/Static/img/m2.png') }}" style="width:100px;">
                    </div>
                    <div
                        style="position: absolute;width:30%;height:120px;float:right;text-align: center;margin-top: 100px;">
                        <img src="{{ asset('fronts/home/Static/img/check.png') }}" alt="已处理的图片" style="width:50px;height:50px;">
                    </div>
                    <div style="width:70%;height:120px;float:left;padding:5px;">
                        <p class="fzmmm fcc fw" style="margin-bottom:2px;"></p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">บัญชีผู้ใช้ที่มีสิทธ์ซื้อ：vip3</p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">จำนวนเงินลงทุน：0</p>

                        <p class="fzmm fcc" style="margin-bottom:0px;text-align:right;">
                            <span style="background: #0ecb81;color: #fff;padding: 10px;border-radius: 5px;">ซื้อเลย</span>
                        </p>

                    </div>
                </div>
                <div style="width:100px;" >
					<div class="progress">
					  <div class="progress-bar" role="progressbar" style="width:90%;" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100">90%</div>
					</div>
				</div>
                <div style="width:100%;height:80px;margin-top:15px;padding:0px 15px;">
                    <div class="obbox" style="width:40%;">
                        <div class="obbox_h">
                            <span class="fzmm fcc">จำนวนเงินเริ่มต้น</span>
                        </div>
                        <div class="obbox_h">
                            <span class="fzmm fcc">2000.00 </span>
                        </div>
                    </div>
                    <div class="obbox" style="width:25%;">
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">เวลา</span>
                        </div>
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">168 วัน</span>
                        </div>
                    </div>
                    <div class="obbox" style="width:35%;">
                        <div class="obbox_h" style="text-align:right;">
                            <span class="fzmm fcc">ปันผลต่อวัน</span>
                        </div>
                        <div class="obbox_h" style="text-align:right;">

                            <span class="fzmmm fcy" style="font-weight:bold;">0.038%</span>

                        </div>
                    </div>

                </div>
            </div>
            <div class="orebox">
                <div style="width:100%;height:120px;">
                    <div style="width:30%;height:120px;float:left;text-align: center;margin-top: -20px;">
                        <img src="{{ asset('fronts/home/Static/img/m3.png') }}" style="width:100px;">
                    </div>
                    <div style="width:70%;height:120px;float:left;padding:5px;">
                        <p class="fzmmm fcc fw" style="margin-bottom:2px;"></p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">บัญชีผู้ใช้ที่มีสิทธ์ซื้อ：vip1</p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">จำนวนเงินลงทุน：0</p>

                        <a href="#">
                            <p class="fzmm fcc" style="margin-bottom:0px;text-align:right;">
                                <span
                                    style="background: #0ecb81;color: #fff;padding: 10px;border-radius: 5px;">ซื้อเลย</span>
                            </p>
                        </a>
                    </div>
                </div>
                <div style="width:100px;">
                    <div class="progress">
                        <div class="progress-bar" role="progressbar" style="width:30%;" aria-valuenow="30"
                            aria-valuemin="0" aria-valuemax="100">30%</div>
                    </div>
                </div>
                <div style="width:100%;height:80px;margin-top:15px;padding:0px 15px;">
                    <div class="obbox" style="width:40%;">
                        <div class="obbox_h">
                            <span class="fzmm fcc">จำนวนเงินเริ่มต้น</span>
                        </div>
                        <div class="obbox_h">
                            <span class="fzmm fcc">7000.00 </span>
                        </div>
                    </div>
                    <div class="obbox" style="width:25%;">
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">เวลา</span>
                        </div>
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">360 วัน</span>
                        </div>
                    </div>
                    <div class="obbox" style="width:35%;">
                        <div class="obbox_h" style="text-align:right;">
                            <span class="fzmm fcc">ปันผลต่อวัน</span>
                        </div>
                        <div class="obbox_h" style="text-align:right;">

                            <span class="fzmmm fcy" style="font-weight:bold;">0.050%</span>

                        </div>
                    </div>

                </div>
            </div>
            <div class="orebox">
                <div style="width:100%;height:120px;">
                    <div style="width:30%;height:120px;float:left;text-align: center;margin-top: -20px;">
                        <img src="{{ asset('fronts/home/Static/img/m4.png') }}" style="width:100px;">
                    </div>
                    <div style="width:70%;height:120px;float:left;padding:5px;">
                        <p class="fzmmm fcc fw" style="margin-bottom:2px;"></p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">บัญชีผู้ใช้ที่มีสิทธ์ซื้อ：vip1</p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">จำนวนเงินลงทุน：0</p>

                        <a href="#">
                            <p class="fzmm fcc" style="margin-bottom:0px;text-align:right;">
                                <span
                                    style="background: #0ecb81;color: #fff;padding: 10px;border-radius: 5px;">ซื้อเลย</span>
                            </p>
                        </a>
                    </div>
                </div>
                <div style="width:100px;">
                    <div class="progress">
                        <div class="progress-bar" role="progressbar" style="width:20%;" aria-valuenow="20"
                            aria-valuemin="0" aria-valuemax="100">20%</div>
                    </div>
                </div>
                <div style="width:100%;height:80px;margin-top:15px;padding:0px 15px;">
                    <div class="obbox" style="width:40%;">
                        <div class="obbox_h">
                            <span class="fzmm fcc">จำนวนเงินเริ่มต้น</span>
                        </div>
                        <div class="obbox_h">
                            <span class="fzmm fcc">40000.00 </span>
                        </div>
                    </div>
                    <div class="obbox" style="width:25%;">
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">เวลา</span>
                        </div>
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">720 วัน</span>
                        </div>
                    </div>
                    <div class="obbox" style="width:35%;">
                        <div class="obbox_h" style="text-align:right;">
                            <span class="fzmm fcc">ปันผลต่อวัน</span>
                        </div>
                        <div class="obbox_h" style="text-align:right;">

                            <span class="fzmmm fcy" style="font-weight:bold;">0.065%</span>



                        </div>
                    </div>

                </div>
            </div>
            <div class="orebox">
                <div style="width:100%;height:120px;">
                    <div style="width:30%;height:120px;float:left;text-align: center;margin-top: -20px;">
                        <img src="{{ asset('fronts/home/Static/img/m5.png') }}" style="width:100px;">
                    </div>
                    <div style="width:70%;height:120px;float:left;padding:5px;">
                        <p class="fzmmm fcc fw" style="margin-bottom:2px;"></p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">บัญชีผู้ใช้ที่มีสิทธ์ซื้อ：vip1</p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">จำนวนเงินลงทุน：0</p>

                        <a href="#">
                            <p class="fzmm fcc" style="margin-bottom:0px;text-align:right;">
                                <span
                                    style="background: #0ecb81;color: #fff;padding: 10px;border-radius: 5px;">ซื้อเลย</span>
                            </p>
                        </a>
                    </div>
                </div>
                <div style="width:100px;">
                    <div class="progress">
                        <div class="progress-bar" role="progressbar" style="width:30%;" aria-valuenow="30"
                            aria-valuemin="0" aria-valuemax="100">30%</div>
                    </div>
                </div>
                <div style="width:100%;height:80px;margin-top:15px;padding:0px 15px;">
                    <div class="obbox" style="width:40%;">
                        <div class="obbox_h">
                            <span class="fzmm fcc">จำนวนเงินเริ่มต้น</span>
                        </div>
                        <div class="obbox_h">
                            <span class="fzmm fcc">300000.00 </span>
                        </div>
                    </div>
                    <div class="obbox" style="width:25%;">
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">เวลา</span>
                        </div>
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">24 วัน</span>
                        </div>
                    </div>
                    <div class="obbox" style="width:35%;">
                        <div class="obbox_h" style="text-align:right;">
                            <span class="fzmm fcc">ปันผลต่อวัน</span>
                        </div>
                        <div class="obbox_h" style="text-align:right;">

                            <span class="fzmmm fcy" style="font-weight:bold;">0.073%</span>



                        </div>
                    </div>

                </div>
            </div>
            <div class="orebox">
                <div style="width:100%;height:120px;">
                    <div style="width:30%;height:120px;float:left;text-align: center;margin-top: -20px;">
                        <img src="{{ asset('fronts/home/Static/img/m6.png') }}" style="width:100px;">
                    </div>
                    <div style="width:70%;height:120px;float:left;padding:5px;">
                        <p class="fzmmm fcc fw" style="margin-bottom:2px;"></p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">บัญชีผู้ใช้ที่มีสิทธ์ซื้อ：vip1</p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">จำนวนเงินลงทุน：0</p>

                        <a href="#">
                            <p class="fzmm fcc" style="margin-bottom:0px;text-align:right;">
                                <span
                                    style="background: #0ecb81;color: #fff;padding: 10px;border-radius: 5px;">ซื้อเลย</span>
                            </p>
                        </a>
                    </div>
                </div>
                <div style="width:100px;">
                    <div class="progress">
                        <div class="progress-bar" role="progressbar" style="width:28%;" aria-valuenow="28"
                            aria-valuemin="0" aria-valuemax="100">28%</div>
                    </div>
                </div>
                <div style="width:100%;height:80px;margin-top:15px;padding:0px 15px;">
                    <div class="obbox" style="width:40%;">
                        <div class="obbox_h">
                            <span class="fzmm fcc">จำนวนเงินเริ่มต้น</span>
                        </div>
                        <div class="obbox_h">
                            <span class="fzmm fcc">800000.00 </span>
                        </div>
                    </div>
                    <div class="obbox" style="width:25%;">
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">เวลา</span>
                        </div>
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">360 วัน</span>
                        </div>
                    </div>
                    <div class="obbox" style="width:35%;">
                        <div class="obbox_h" style="text-align:right;">
                            <span class="fzmm fcc">ปันผลต่อวัน</span>
                        </div>
                        <div class="obbox_h" style="text-align:right;">

                            <span class="fzmmm fcy" style="font-weight:bold;">0.085%</span>



                        </div>
                    </div>

             
                </div>
            </div>
            <div class="orebox">
                <div style="width:100%;height:120px;">
                    <div style="width:30%;height:120px;float:left;text-align: center;margin-top: -20px;">
                        <img src="{{ asset('fronts/home/Static/img/m7.png') }}" style="width:100px;">
                    </div>
                    <div style="width:70%;height:120px;float:left;padding:5px;">
                        <p class="fzmmm fcc fw" style="margin-bottom:2px;"></p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">บัญชีผู้ใช้ที่มีสิทธ์ซื้อ：vip1</p>
                        <p class="fzmm fcc" style="margin-bottom:2px;">จำนวนเงินลงทุน：0</p>

                        <a href="#">
                            <p class="fzmm fcc" style="margin-bottom:0px;text-align:right;">
                                <span
                                    style="background: #0ecb81;color: #fff;padding: 10px;border-radius: 5px;">ซื้อเลย</span>
                            </p>
                        </a>
                    </div>
                </div>
                <div style="width:100px;">
                    <div class="progress">
                        <div class="progress-bar" role="progressbar" style="width:10%;" aria-valuenow="10"
                            aria-valuemin="0" aria-valuemax="100">10%</div>
                    </div>
                </div>
                <div style="width:100%;height:80px;margin-top:15px;padding:0px 15px;">
                    <div class="obbox" style="width:40%;">
                        <div class="obbox_h">
                            <span class="fzmm fcc">จำนวนเงินเริ่มต้น</span>
                        </div>
                        <div class="obbox_h">
                            <span class="fzmm fcc">1200000.00 </span>
                        </div>
                    </div>
                    <div class="obbox" style="width:25%;">
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">เวลา</span>
                        </div>
                        <div class="obbox_h" style="text-align:center;">
                            <span class="fzmm fcc">720 วัน</span>
                        </div>
                    </div>
                    <div class="obbox" style="width:35%;">
                        <div class="obbox_h" style="text-align:right;">
                            <span class="fzmm fcc">ปันผลต่อวัน</span>
                        </div>
                        <div class="obbox_h" style="text-align:right;">

                            <span class="fzmmm fcy" style="font-weight:bold;">0.095%</span>



                        </div>
                    </div>

                    <!-- 新增的图片标签 -->
                    <!--<div style="position: absolute; top: 0; left: 50%; transform: translateX(-50%);">-->
                    <!--  <img src="/Upload/coin/dui.png" alt="已处理的图片" style="width:10px;height:10px;">-->
                    <!--</div>					-->
                </div>
            </div>
            <div class="btmbox"></div>
        </div>


        <!--独资矿机-->
        <div id="dzbox" style="width:100%;padding:10px 0px;display:none;background:#fff;">


            <div class="btmbox"></div>
        </div>

        <!--我的矿机-->
        <div id="myorebox"
            style="width: 100%; min-height: 600px; padding: 10px 0px; background: rgb(255, 255, 255); display: none;">
            <div class="orebox">
                <div style="width:100%;height:120px;line-height:120px;text-align:center;">
                    <span class="fzmm fcc">ไม่มีการบันทึกในขณะนี้</span>
                </div>
            </div>

            <div class="btmbox"></div>
        </div>




    </div>
@endsection

@push('scripts')

    {{-- Tab --}}
    {{-- <script>
        function openTab(evt, TabName) {
          var i, orebox, listbox;
          orebox = document.getElementsByClassName("orebox");
          for (i = 0; i < orebox.length; i++) {
            orebox[i].style.display = "none";
          }
          listbox = document.getElementsByClassName("listbox");
          for (i = 0; i < listbox.length; i++) {
            listbox[i].className = listbox[i].className.replace(" hsborder", "");
          }
          document.getElementById(TabName).style.display = "block";
          evt.currentTarget.className += " hsborder";
        }
        </script> --}}
    {{-- back --}}
    <script>
        function Allfun() {
            window.location ="{{ asset('/member/funds') }}";
        }
    </script>
    <script>
        function myFun() {
            window.location ="{{ asset('/member/my-funds') }}";
        }
    </script>
    <script>
        function goback() {
            window.history.go(-1);
        }
    </script>
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="{{ asset('fronts/assets/layer.js') }}"></script>
    <script type="text/javascript" src="{{ asset('fronts/assets/layui.js') }}"></script>
@endpush

@push('styles')
    <style>
        ::-webkit-input-placeholder {
            color: #b5b5b5;
            font-size: 12px;
        }

        ::-moz-placeholder {
            color: #b5b5b5;
            font-size: 12px;
        }

        input:focus {
            background: #ebecf0;
            outline: 1px solid #ebecf0;
        }

        a:hover,
        a:link,
        a:visited,
        a:active {
            color: #000000;
            text-decoration: none;
        }

        .no_header {
            position: fixed;
            z-index: 9999;
            background: #121420;
            padding: 0px 10px;
            top: 0px;
        }

        .txtl {
            line-height: 50px;
            width: 10%;
        }

        .oreimgbox {
            width: 100%;
            height: 150px;
            margin-top: 50px;
        }

        .oplist {
            width: 100% !important;
            height: 50px !important;
            background: #fff;
            padding: 0px 15px;
            border-radius: 30px 30px 0 0;
        }

        .listbox {
            height: 50px;
            line-height: 50px;
            float: left;
        }

        .emptybox {
            width: 30px;
            height: 50px;
            float: left;
        }

        .hsborder {
            border-bottom: 3px solid #00b897;
        }

        .btmbox {
            width: 100% !important;
            height: 60px !important;
            background: #fff !important;
        }
        
        .orebox {
            width: 100%;
            margin: 0px auto;
            background: #f7f9fc;
            margin-bottom: 20px;
            box-shadow: 0 2px 10px 0 rgb(0 0 0 / 10%);
            padding: 10px;
        }

        .progress-bar {
            color: #000;
            background: linear-gradient(to right, #f77062, #fe5196) !important;
        }

        .progress {
            height: 0.9rem;
            background-color: #f5f5f5 !important;
            border-radius: .5rem;
        }

        .obbox {
            width: 33.33%;
            height: 80px;
            float: left;
        }

        .obbox_h {
            width: 100%;
            height: 40px;
            line-height: 40px;
        }
    </style>
@endpush