设置 qq

src/router/modules/root.js

@@ -4,6 +4,11 @@ export default [
         meta: {requireLogin: false},
         component: () => import(/* webpackChunkName: 'root' */ '@/views/test')
     },
+    {
+        path: '/redirect',
+        meta: {requireLogin: false},
+        component: () => import(/* webpackChunkName: 'root' */ '@/views/redirect')
+    },
     {
         path: '/',
         meta: {requireLogin: false},

src/views/account/login.vue

@@ -179,7 +179,9 @@
                         <el-link style="margin-left: 20px;">忘记密码</el-link>
                         <el-link style="margin-left: 20px;" @click="registerHandleClick">立即注册</el-link>
                         <div class="other-login">
+                            <span @click="redirectUrl(qqLoginAuthorizeUrl)">
                                 <svg-icon name="loginQQ" class="other-login-icon" />
+                            </span>
                             <svg-icon name="loginWx" class="other-login-icon" />
                         </div>
                     </div>

src/views/form/setting.vue

@@ -32,7 +32,7 @@
                         accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP"
                         :headers="getUploadHeader"
                         :on-success="uploadSubmitPromptHandle"
-                        action="/user/file/upload"
+                        :action="getUploadUrl"
                         :show-file-list="false">
                         <el-link slot="trigger" size="small" type="primary">请上传提示图片 *</el-link>
                     </el-upload>
@@ -415,7 +415,7 @@
                             accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP"
                             :headers="getUploadHeader"
                             :on-success="uploadShareImgHandle"
-                            action="/user/file/upload"
+                            :action="getUploadUrl"
                             :show-file-list="false">
                             <div class="block">
                                 <el-image
@@ -474,12 +474,34 @@
                             class="setting-input" style="width: 80%" v-model="userProjectSettingData.shareDesc"/>
                     </el-col>
                 </el-row>
+                <div v-if="userProjectSettingData.shareDesc||userProjectSettingData.shareTitle||userProjectSettingData.shareImg">
+                    <div class="share-preview">
+                        <div class="share-preview-msg">
+                            <div>
+                                <p class="share-preview-msg-title">
+                                    {{ userProjectSettingData.shareTitle }}
+                                </p>
+                                <p class="share-preview-msg-desc">
+                                    {{ userProjectSettingData.shareDesc }}
+                                </p>
+                            </div>
+                            <div>
+                                <img :src="userProjectSettingData.shareImg" style="width: 49px;height: 46px;"/>
+                            </div>
+                        </div>
+                        <div>
+                            <img class="share-user-avatar" :src="getUserInfo.avatar"/>
+                        </div>
+                    </div>
+                </div>
             </el-col>
         </el-row>
     </el-form>
 </template>
 
 <script>
+import store from '@/store'
+
 export default {
     name: 'projectSetting',
     props: {
@@ -541,6 +563,12 @@ export default {
             return {
                 'token': this.$store.getters['user/isLogin']
             }
+        },
+        getUploadUrl() {
+            return `${process.env.VUE_APP_API_ROOT}/user/file/upload`
+        },
+        getUserInfo() {
+            return JSON.parse(this.$store.getters['user/userInfo'])
         }
     },
     mounted() {
@@ -736,6 +764,70 @@ export default {
     justify-content: center;
 }
 
+.share-preview {
+    width: 360px;
+    height: 162px;
+    margin: 0 auto;
+    border-radius: 5px;
+    background-color: rgba(210, 210, 210, 42);
+    border: 1px solid rgba(255, 255, 255, 100);
+    display: flex;
+    align-content: center;
+    align-items: center;
+    justify-content: space-around;
+}
+
+.share-preview-msg {
+    width: 210px;
+    height: 88px;
+    border-radius: 5px;
+    background-color: white;
+    color: rgba(16, 16, 16, 100);
+    box-shadow: 0px 0px 3px 0px rgba(157, 158, 162, 100);
+    padding: 5px;
+    display: flex;
+    align-items: center;
+    justify-items: center;
+    justify-content: center;
+    position: relative;
+}
+
+.share-preview-msg::after {
+    content: '';
+    border: 10px solid transparent;
+    border-left-color: #fff;
+    position: absolute;
+    right: -18px;
+    top: 5px;
+    width: 0;
+}
+
+
+.share-preview-msg-title {
+    line-height: 22px;
+    height: 25px;
+    margin: 3px;
+    color: rgba(16, 16, 16, 100);
+    font-size: 14px;
+    text-align: center;
+}
+
+.share-preview-msg-desc {
+    margin: 3px;
+    color: rgba(144, 147, 153, 100);
+    font-size: 12px;
+    line-height: 20px;
+    height: 60px;
+    width: 155px;
+    text-align: left;
+}
+
+.share-user-avatar {
+    width: 49px;
+    height: 49px;
+    border-radius: 6px;
+}
+
 /deep/ .setting-input input {
     border: none;
     border-bottom: 1px solid rgba(187, 187, 187, 100);

src/views/home/index.vue

@@ -4,7 +4,7 @@
             <el-row type="flex" align="middle">
                 <el-col :span="4" :offset="1">
                     <img src="@/assets/images/indexLogo.png" class="header-logo-img"
-                         @click="$router.push({path:'/project/create'})"
+                         @click="$router.push({path:'/'})"
                     >
                 </el-col>
                 <el-col :span="10">
@@ -17,12 +17,6 @@
                             {{ item.title }}
                         </el-menu-item>
                     </el-menu>
-                    <!--                    <span v-for="(item, index) in menuRouters" :key="index"-->
-                    <!--                          class="menu-item"-->
-                    <!--                          @click="activeMenuHandle(item.routerPath)"-->
-                    <!--                    >-->
-                    <!--                        {{ item.title }}-->
-                    <!--                    </span>-->
                 </el-col>
                 <el-col :span="1">
                     <el-button round>升级</el-button>
@@ -67,7 +61,7 @@
                             </div>
                         </div>
                         <div slot="reference" style="display: flex; align-items: center; justify-content: center;">
-                            <img :src="getUserInfo.avatar" style="width: 50px; height: 50px; border-radius: 100px;">
+                            <img :src="getUserInfo.avatar" class="user-avatar">
                         </div>
                     </el-popover>
                 </el-col>
@@ -187,5 +181,11 @@ export default {
         border: 1px solid rgba(210, 210, 210, 78);
     }
 }
+.user-avatar {
+    width: 50px;
+    height: 50px;
+    border-radius: 100px;
+    cursor: pointer;
+}
 
 </style>

src/views/redirect.vue

@@ -0,0 +1,46 @@
+<template>
+    <div />
+</template>
+
+<script>
+import {getCurrentDomain, getQueryString} from '@/utils'
+
+export default {
+    name: 'Redirect',
+    data() {
+        return {}
+    },
+    created() {
+        // qq 登录重定向
+        let code = getQueryString('code')
+        let state = getQueryString('state')
+        if (code && state) {
+            let reUrl = getCurrentDomain() + '/redirect'
+            this.$api.post('/login/qq', {authorizeCode: code, redirectUri: reUrl}).then(res => {
+                if (res.data) {
+                    this.msgSuccess('登录成功')
+                    this.$store.dispatch('user/login', res.data).then(() => {
+                        // 重置状态
+                        this.$store.dispatch('global/loginExpired', false).then(() => {
+                        })
+                        // 登录成功后路由跳回
+                        if (this.$route.query.redirect) {
+                            this.$router.replace({
+                                path: this.$route.query.redirect
+                            })
+                        } else {
+                            if (window.history.length <= 1) {
+                                this.$router.push({path: '/home'})
+                            } else {
+                                this.$router.push({path: '/home'})
+                            }
+                        }
+                    })
+                }
+            })
+        }
+    },
+    methods: {}
+
+}
+</script>