feat(login): 375 [Migration] Complete login logic (#376)

Done #375

Author: vanoneang

package-lock.json

@@ -48,7 +48,7 @@
     >
       <div style="text-align: center;">
         <div class="avatar-croppa-container">
-          <croppa
+          <!-- <croppa
             ref="croppa"
             :width="cropRule.width"
             :height="cropRule.height"
@@ -63,7 +63,7 @@
             :quality="quality"
             :initial-image="cropImg"
           >
-          </croppa>
+          </croppa> -->
         </div>
         <div style="margin-top: 1em;">通过鼠标滚轮调节头像大小</div>
       </div>
@@ -111,14 +111,14 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
-import Vue from 'vue'
-import Croppa from 'vue-croppa'
+// import Vue from 'vue'
+// import Croppa from 'vue-croppa'
 import axios, { post } from '@/lin/plugin/axios'
 import User from '@/lin/model/user'
 import 'vue-croppa/dist/vue-croppa.css'
 import defaultAvatar from '@/assets/image/user/user.png'
 
-Vue.use(Croppa)
+// Vue.use(Croppa)
 
 const width = 150
 const height = 150

src/component/base/table/lin-table.vue.rej

@@ -1,7 +1,9 @@
-import Vue from 'vue'
+// TODO: Vue3 Plugin
+import { createApp } from 'vue'
 import Preview from '@/component/base/preview/preview'
 
 const previewImage = {}
+const app = createApp()
 previewImage.install = vue => {
   // eslint-disable-line
   const PreviewConstructor = vue.extend(Preview)
@@ -22,7 +24,7 @@ previewImage.install = vue => {
     return instance
   }
 
-  vue.prototype.$imagePreview = (opts = {}) => {
+  app.config.globalProperties.$imagePreview = (opts = {}) => {
     // eslint-disable-line
     const elem = document.createElement('div')
     if (!instance) {
@@ -44,6 +46,6 @@ previewImage.install = vue => {
   }
 }
 
-Vue.use(previewImage)
+// Vue.use(previewImage)
 
 export default previewImage

src/component/layout/user.vue

@@ -32,5 +32,7 @@ app.directive('permission', permissionDirective)
 
 app.mount('#app')
 
+app.config.devtools = true
+
 // 设置 App 实例
 window.App = app

src/lin/plugin/preview/index.js

@@ -173,6 +173,8 @@ import { ref, onMounted } from 'vue'
 
 export default {
   setup() {
+    console.log(1111)
+
     const showTeam = ref(false)
     const activeName = ref('first')
     const { clientWidth } = document.body

src/main.js

@@ -70,7 +70,7 @@
     >
       <div style="text-align: center;">
         <div class="avatar-croppa-container">
-          <croppa
+          <!-- <croppa
             ref="croppa"
             :width="cropRule.width"
             :height="cropRule.height"
@@ -84,7 +84,7 @@
             :show-loading="true"
             :quality="quality"
             :initial-image="cropImg"
-          ></croppa>
+          ></croppa> -->
         </div>
         <div style="margin-top: 1em;">通过鼠标滚轮调节头像大小</div>
       </div>
@@ -100,14 +100,14 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
-import Vue from 'vue'
-import Croppa from 'vue-croppa'
+// import Vue from 'vue'
+// import Croppa from 'vue-croppa'
 import User from '@/lin/model/user'
 import axios, { post, put } from '@/lin/plugin/axios'
 import 'vue-croppa/dist/vue-croppa.css'
 import defaultAvatar from '@/assets/image/user/user.png'
 
-Vue.use(Croppa)
+// Vue.use(Croppa)
 
 const width = 150
 const height = 150

src/view/about/about.vue

@@ -22,12 +22,12 @@
 </template>
 
 <script>
-import { reactive, ref, onMounted } from 'vue'
-import { Message } from 'element-plus'
+import { reactive, ref, onMounted, getCurrentInstance } from 'vue'
 import { useStore } from 'vuex'
 import { useRouter } from 'vue-router'
 import UserModel from '@/lin/model/user'
 import Utils from '@/lin/util/util'
+import Config from '@/config'
 
 export default {
   setup() {
@@ -36,6 +36,7 @@ export default {
     const store = useStore()
     const router = useRouter()
     const throttleLogin = ref(null)
+    const { ctx } = getCurrentInstance()
 
     const account = reactive({
       username: 'root',
@@ -52,11 +53,13 @@ export default {
         await UserModel.getToken(username, password)
         await getInformation()
         loading.value = false
-        router.push('/about')
-        Message.success('登录成功')
+        router.push(Config.defaultRoute)
+        ctx.$message({
+          message: '登录成功',
+          type: 'success',
+        })
       } catch (e) {
         loading.value = false
-        console.log(e)
       }
     }
 

src/view/center/center.vue

@@ -23,6 +23,7 @@ module.exports = {
       .loader('vue-markdown-loader/lib/markdown-compiler')
   },
   configureWebpack: {
+    devtool: 'source-map',
     resolve: {
       extensions: ['.js', '.json', '.vue', '.scss', '.html'],
     },