remove element-plus

nuts-foundation · Apr 12, 2021 · cd46b5c · cd46b5c
1 parent 8bc8269
commit cd46b5c
Show file tree

Hide file tree

Showing 10 changed files with 61 additions and 168 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -5,8 +5,8 @@
   "private": true,
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "webpack",
-    "watch": "webpack --watch",
+    "build": "webpack --mode=production",
+    "watch": "webpack --mode=development --watch",
     "lint": "eslint --ext .js,.vue web/src --fix"
   },
   "repository": {
@@ -32,7 +32,6 @@
     "webpack-cli": "^4.6.0"
   },
   "dependencies": {
-    "element-plus": "*",
     "vue": "^3.0.11",
     "vue-router": "^4.0.6"
   }

diff --git a/web/src/App.vue b/web/src/App.vue
@@ -0,0 +1,11 @@
+<template>
+  <div id="nav">
+    <router-link to="/">Home</router-link> |
+    <router-link to="/login">Login</router-link> |
+  </div>
+  <router-view />
+</template>
+
+<script>
+
+</script>
diff --git a/web/src/Landing.vue b/web/src/Landing.vue
@@ -1,3 +1,3 @@
 <template>
-  <router-link to="/login">Login</router-link>
+  <h1>Welcome!</h1>
 </template>
diff --git a/web/src/Login.vue b/web/src/Login.vue
@@ -1,20 +1,9 @@
 <template>
-  <el-row :align="middle" :gutter="20">
-    <el-col :offset="6" :span="10">
-      <el-form ref="form" :model="form" label-width="120px">
-        <el-form-item label="Enter username">
-          <el-input placeholder="Username" v-model="form.username"></el-input>
-        </el-form-item>
-        <el-form-item label="Enter password">
-          <el-input placeholder="Password" v-model="form.password" show-password></el-input>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="onSubmit">Login</el-button>
-          <el-button>Cancel</el-button>
-        </el-form-item>
-      </el-form>
-    </el-col>
-  </el-row>
+  <form ref="form" :model="form" label-width="120px">
+    <input placeholder="Username" />
+    <input placeholder="Password" />
+    <button>Cancel</button>
+  </form>
 </template>
 
 <script>

diff --git a/web/src/admin/App.vue b/web/src/admin/App.vue
@@ -1,16 +1,16 @@
 <template>
-  <el-container>
-    <el-header>
+  <container>
+    <header>
       <router-link to="customers">Customers</router-link>
       <router-link to="/login">logout</router-link>
-    </el-header>
-    <el-container>
-      <el-aside width="200px">Aside</el-aside>
-      <el-main>
+    </header>
+    <container>
+      <aside width="200px">Aside</aside>
+      <main>
         <router-view></router-view>
-      </el-main>
-    </el-container>
-  </el-container>
+      </main>
+    </container>
+  </container>
 </template>
 
 <script>

diff --git a/web/src/admin/Customers.vue b/web/src/admin/Customers.vue
@@ -1,10 +1,5 @@
 <template>
-  <el-table :data="customers">
-    <el-table-column prop="name" label="Name">
-    </el-table-column>
-    <el-table-column prop="did" label="DID">
-    </el-table-column>
-  </el-table>
+  <h1>customer</h1>
 </template>
 
 <script>

diff --git a/web/src/index.html b/web/src/index.html
@@ -4,7 +4,9 @@
   <meta charset="utf-8"/>
   <title><%= htmlWebpackPlugin.options.title %></title>
 </head>
-<body id="app">
+<body>
+<div id="app">
   <router-view></router-view>
+</div>
 </body>
 </html>
diff --git a/web/src/index.js b/web/src/index.js
@@ -1,36 +1,33 @@
-import { createApp } from 'vue'
-import ElementPlus from 'element-plus';
-import 'element-plus/lib/theme-chalk/index.css';
-import App from './admin/App.vue'
-import Customers from './admin/Customers.vue'
+import { createApp, h } from 'vue'
+import { createRouter, createWebHashHistory } from 'vue-router'
+// import App from './admin/App.vue'
+// import Customers from './admin/Customers.vue'
 import Login from './Login.vue'
+import App from './App.vue'
 import Landing from './Landing.vue'
-import * as VueRouter from 'vue-router'
-
-const About = { template: '<div>Provided by the Nuts community for demo purposes.</div>' }
 
 const routes = [
   { path: '/', component: Landing },
-  { path: '/about', component: About },
   { path: '/login', component: Login },
-  { path: '/admin',
-    component: App,
-    children: [
-      {
-        path: 'customers',
-        component: Customers
-      }
-    ]
-  }
+//   { path: '/admin',
+//     component: App,
+//     children: [
+//       {
+//         path: 'customers',
+//         component: Customers
+//       }
+//     ]
+//   }
 ]
 
-const router = VueRouter.createRouter({
+const router = createRouter({
   // We are using the hash history for simplicity here.
-  history: VueRouter.createWebHashHistory(),
+  history: createWebHashHistory(),
   routes // short for `routes: routes`
 })
 
-const app = createApp({})
-app.use(ElementPlus)
+// const app = createApp({})
+const app = createApp(App)
+
 app.use(router)
 app.mount('#app')