Build Web App with RoR & Bootstrap

I need a responsive web app build from scratch. === 1. Admin Area === 1.1 File Manager There must be a simple file manager. It must display the contents of 1 directory only. There is no need for folders or any functions other than 1) upload and 2) delete files. * allow only .XLS files to be uploaded. * support uploading multiple files at once. * allow drag & drop of multiple files. * file list must always be sorted by name, ascending * must be able to select 1 or multiple files and click delete. After a "are you sure?" dialog, the files are permanently deleted. 1.2 User Management The admin must be able to create, edit and delete users. 1.2.1 Creating a user requires the admin to provide; * username * password * customer name -> The system must not allow duplicate usernames. 1.2.2 Modifying a user The admin must be able to change any user's password or customer name field without needing to know that user's password. 1.2.2 Deleting a user The admin must be able to select 1 or multiple users and click delete. After a "are you sure?" dialog, the users are permanently deleted. === 2. Customer View === 2.1 Login There must be a login page where the customer enters their username and password (as provided by the admin) to login. * there must be a button on the login page that says "forget password?", which, after clicking launches a form where the user can enter their a) username b) full name c) email d) contact number. When submitting this form, the system must send an email to the admin with this information. 2.2 Table viewer Once the customer is logged in, there is only 1 page, not scrollable. This is the image I attach here. 2.2.1 Left side navigation (file list) * On the left hand side, there is a navigation bar (always present, doesn't hide) which lists all uploaded .XLS files WHERE the CUSTOMER NAME is equal to the current users's customer name. Let me explain with an example: EXAMPLE The admin uploaded 3 excel files: 1. Dynapro - Opportunity [login to view URL] 2. Dynapro - [login to view URL] 3. Flowers 4 U - Opportunity [login to view URL] The admin also creates a user: username: superman password: abc123 customer: Dynapro Then, superman will login. The customer will see the table viewer (the attached image), and the left navigation will only display the the files where the string before substring " - " (so before the space dash space) is equal to the customer that this user has. So superman should only see: 1. Dynapro - Opportunity [login to view URL] 2. Dynapro - [login to view URL] But, they must be formatted to remove all characters before the "-" and the extension .xls. so in reality, superman only sees: "Opportunity list" "Inventory" This must be determined each time the user logs in, because the excel files may be added/deleted all the time. 2.2.2 When the user clicks one of the reports from the navigation bar, a table is shown to the right, populating all the available space. The table must use the [login to view URL] plugin (unless you know a much better one). The contents of the table is the contents of the xls file the user has selected. i.e., if Superman selected "Opportunity List", the table will display the contents of the "Dynapro - Opportunity [login to view URL]" file in the following manner: * Only the first sheet in the Excel file is shown. Other sheets, if any, are ignored. * The first row in the Excel sheet is the header row. * any other rows, if containing data, present the remaining rows. we must use the datable scrollbars like illustrated in this example: [login to view URL] When the user selects another file, the table LIVE loads the contents of that other file. 2.2.3 Download When superman presses this, the system will compress (.ZIP) all Excel files for his customer name (so only the 2 Dynapro files) and download them to his computer. 2.2.4 Sign out When the user clicks sign out, they are directed to a "thank you for visiting" type of page.