admin.html
1 {{> head }} 2 <section id="main" class="wrapper style2"> 3 <div id="admin_pane" class="inner"> 4 <header class="major special" style="padding-bottom: 0"> 5 <h1>Admin Page</h1> 6 </header> 7 {{^session}} 8 <form method="post" action="login"> 9 <div class="row gtr-uniform"> 10 <div class="col-6 col-12-xsmall"> 11 <input type="text" name="name" id="name" value="" placeholder="Name" required/> 12 </div> 13 <div class="col-6 col-12-xsmall"> 14 <input type="password" name="password" id="password" value="" placeholder="Password" required /> 15 </div> 16 <input type="text" name="honey" value="" style="display: none !important" tabindex="-1" autocomplete="off"/> 17 <div class="col-12"> 18 <ul class="actions"> 19 <li><input type="submit" value="Log in" /></li> 20 </ul> 21 </div> 22 </div> 23 </form> 24 {{/session}} 25 {{#session}} 26 <h2>Welcome, {{ member.profile.display_name }}</h2> 27 <ul id="admin_buttons" class="actions"> 28 <li><a class="button" hx-target="#mgmt_panel" hx-swap="show:#mgmt_anchor:top" hx-get="events" æ-tab>Events</a></li> 29 <li><a class="button" hx-target="#mgmt_panel" hx-swap="show:#mgmt_anchor:top" hx-get="places" æ-tab>Places</a></li> 30 <li><a class="button" hx-target="#mgmt_panel" hx-swap="show:#mgmt_anchor:top" hx-get="menu" æ-tab>Menu</a></li> 31 <li><a class="button" hx-target="#mgmt_panel" hx-swap="show:#mgmt_anchor:top" hx-get="finances" æ-tab>Finances</a></li> 32 </ul> 33 <div id="mgmt_anchor" style="transform: translateY(-5em)"></div> 34 <div id="mgmt_panel"> 35 </div> 36 37 <!--<section id="food" class="hidden"> 38 <form id="new_menu_item" method="post" action="{{ path }}menu" enctype="multipart/form-data"> 39 <div class="row gtr-uniform"> 40 <img id="menu_image" src="{{ static }}images/cred.png" /> 41 <div class="col-6 col-12-xsmall"> 42 <label for="img">Upload an image</label><br/> 43 <input type="file" id="img" name="img" accept="images/*" /> 44 </div> 45 <div class="col-4 col-12-xsmall"> 46 <input type="text" name="title" placeholder="Item name" required /> 47 </div> 48 <div class="col-4 col-12-xsmall"> 49 <input type="text" name="price" pattern="[0-9]+" placeholder="How many Credensos is this valued at?" /> 50 </div> 51 <div class="col-4 col-12-xsmall"> 52 <select name="category"> 53 <option value="food">Food</option> 54 <option value="drink">Drink</option> 55 <option value="other">Other</option> 56 </select> 57 </div> 58 <div class="col-12"> 59 <textarea name="content" rows=3 placeholder="Describe what you're offering or requesting" required></textarea> 60 </div> 61 <div class="col-12"> 62 <ul class="actions"> 63 <li><input type="submit" value="Post item" /></li> 64 </ul> 65 </div> 66 </div> 67 </form> 68 </section> 69 <section id="finances" class="hidden"> 70 <h3>Record cashflow</h3> 71 <form id="new_menu_item" method="post" action="{{ path }}finances" enctype="multipart/form-data"> 72 <div class="row gtr-uniform"> 73 <div class="col-4 col-12-xsmall"> 74 <input type="date" name="date" placeholder="Item name" required /> 75 </div> 76 <div class="col-4 col-12-xsmall"> 77 <input type="text" name="amount" pattern="[-0-9]+" placeholder="Donation value" required /> 78 </div> 79 <div class="col-4 col-12-xsmall"> 80 <input type="text" name="link" placeholder="Link to the donator's webpage" /> 81 </div> 82 <div class="col-12"> 83 <input type="text" name="description" placeholder="What is this about?" required /> 84 </div> 85 <div class="col-12"> 86 <ul class="actions"> 87 <li><input type="submit" value="Add record" /></li> 88 </ul> 89 </div> 90 </div> 91 </form> 92 </section> 93 --> 94 95 <section id="calendar" class="hidden"> 96 {{>admin/events}} 97 </section> 98 99 100 {{/session}} 101 </div> 102 </section> 103 <script> 104 æ('tab').forEach(tab => { 105 tab.listen('click', (e) => tab.solo('primary')) 106 }) 107 //const buttons = document.querySelector('#admin_buttons') 108 109 //const click = (e) => { 110 // e.preventDefault() 111 // const id = e.target.hash 112 // document.querySelectorAll('#admin_pane section').forEach(section => { 113 // section.classList.add('hidden') 114 // }) 115 116 // buttons.querySelectorAll('a').forEach(link => { 117 // link.classList.remove('primary') 118 // }) 119 120 // document.querySelector(id).classList.remove('hidden') 121 // buttons.querySelector(`[href='${id}']`).classList.add('primary') 122 //} 123 124 //buttons.querySelectorAll('a').forEach(link => { 125 // link.addEventListener('click', click) 126 //}) 127 128 //const previewMenuImage = (e) => { 129 // console.log('Previewing image') 130 // const file = e.target.files[0] 131 132 // if (file !== undefined) { 133 // const img = document.getElementById('menu_image') 134 // img.src = URL.createObjectURL(file) 135 // img.alt = file.name 136 // } 137 //} 138 139 //document.getElementById('img').addEventListener('change', previewMenuImage) 140 141 //const menu_form = document.querySelector('#new_menu_item') 142 //menu_form.addEventListener('submit', async (e) => { 143 // window.location.hash = "" 144 // const data = new FormData(nm_form) 145 // const response = await fetch('market', { 146 // method: "POST", 147 // body: data 148 // }) 149 150 // window.location.reload() 151 //}) 152 153 </script> 154 <style> 155 .hidden { 156 display: none; 157 } 158 159 #menu_image { 160 width: 100%; 161 max-width: 30em; 162 } 163 </style> 164 165 {{>foot}}