final-/admin.html at main · yushhsu/final- · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Back-End</title>
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="css/admin.css";>
</head>
<body>
    <nav class="topBar">
        <div class="wrap">
            <h1><a href="#" class="logo">WOWOROOM</a></h1>
            <span class="material-icons menuToggle">
                menu
            </span>
            <ul class="topBar-menu">
                <li><a href="#">後台管理</a></li>
                <li><a href="#">管理員登入</a></li>
            </ul>
        </div>
    </nav>
    <section class="wrap">
        <h2 class="section-title">全品項營收比重</h2>
        <div id="chart"></div>
    </section>
    <section class="wrap orderPage-list">
        <a href="#" class="discardAllBtn">清除全部訂單</a>
        <div class="orderTableWrap">
            <table class="orderPage-table">
                <thead>
                    <tr>
                        <th width="10%">訂單編號</th>
                        <th width="10%">聯絡人</th>
                        <th width="15%">聯絡地址</th>
                        <th width="10%">電子郵件</th>
                        <th width="23%">訂單品項</th>
                        <th width="6%">訂單日期</th>
                        <th width="10%">訂單狀態</th>
                        <th width="5%">操作</th>
                    </tr>
                </thead>
                <tbody class="js-orderList">
                    <tr>
                        <td>10088377474</td>
                        <td>
                          <p>小杰</p>
                          <p>0912345678</p>
                        </td>
                        <td>高雄市前鎮區六合路183巷66號</td>
                        <td>[email protected]</td>
                        <td>
                          <p>Louvre 雙人床架</p>
                        </td>
                        <td>2021/03/08</td>
                        <td class="orderStatus">
                          <a href="#">未處理</a>
                        </td>
                        <td>
                          <input type="button" class="delSingleOrder-Btn" value="刪除">
                        </td>
                    </tr>
                    <tr>
                        <td>10088377475</td>
                        <td>
                            <p>麥特</p>
                            <p>0912345678</p>
                        </td>
                        <td>桃園市平鎮區榮耀路13巷90號</td>
                        <td>[email protected]</td>
                        <td>
                            <p>Louvre 雙人床架</p>
                        </td>
                        <td>2021/03/08</td>
                        <td class="orderStatus">
                            <a href="#">已處理</a>
                        </td>
                        <td>
                            <input type="button" class="delSingleOrder-Btn" value="刪除">
                        </td>
                    </tr>
                    <tr>
                        <td>10088377581</td>
                        <td>
                            <p>歐爾</p>
                            <p>0912345678</p>
                        </td>
                        <td>高雄市苓雅區武廟路22巷188號</td>
                        <td>[email protected]</td>
                        <td>
                            <p>Louvre 雙人床架</p>
                        </td>
                        <td>2021/03/08</td>
                        <td class="orderStatus">
                            <a href="#">未處理</a>
                        </td>
                        <td>
                            <input type="button" class="delSingleOrder-Btn" value="刪除">
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </section>

<!-- C3 D3 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.16.0/d3.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.18/c3.js"></script>

<!-- axios -->
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>

// 預設 JS，請同學不要修改此處
let menuOpenBtn = document.querySelector('.menuToggle');
let linkBtn = document.querySelectorAll('.topBar-menu a');
let menu = document.querySelector('.topBar-menu');
menuOpenBtn.addEventListener('click', menuToggle);

linkBtn.forEach((item) => {
    item.addEventListener('click', closeMenu);
})

function menuToggle() {
    if(menu.classList.contains('openMenu')) {
        menu.classList.remove('openMenu');
    }else {
        menu.classList.add('openMenu');
    }
}
function closeMenu() {
    menu.classList.remove('openMenu');
}
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.18/c3.css";>
<script src="final/config.js"></script>
<script src="final/finalAdmin.js"></script>
</body>
</html>