首页头部组件封装

src/myout/index.vue

@@ -1,84 +1,28 @@
 <template>
-    <div class="app-wrapper">
-        <div class='fixed-header'>
-            <homebar />
-        </div>
-        <section class="app-main">
-            <transition name="fade-transform" mode="out-in">
-                <router-view />
-            </transition>
-        </section>
-        <el-dialog width="30%" title="联系我们" :visible.sync="dialogVisible">
+  <div class="app-wrapper">
+    <div class='fixed-header'>
+      <homebar />
+    </div>
+    <section class="app-main">
+      <transition name="fade-transform" mode="out-in">
+        <router-view />
+      </transition>
+    </section>
+    <el-dialog width="30%" title="联系我们" :visible.sync="dialogVisible">
       <img width="100%" src="@/assets/images/wx.jpg" alt="">
-
-    </el-dialog>
-    <el-dialog width="50%" title="新建应用" :visible.sync="dialogVisibleApp">
-      <div class="scene-container">
-        <div class="scene-wrapper">
-          <!-- <div class="title-wrapper">
-            <div class="icon-text">
-              <i class="el-icon-thumb title-icon"></i>
-              <span class="title-text">猜你想要</span>
-            </div>
-          </div> -->
-          <div class="grid-row">
-            <div class="grid-col">
-              <div class="card-item create-blank-app" @click="innerVisible = true">
-                <i class="el-icon-plus create-icon"></i>
-                <div class="create-text">创建空白应用</div>
-              </div>
-            </div>
-            <div class="grid-col">
-              <div class="card-item scene-item" @click="confirmAdd()">
-                <img src="https://g.jdycdn.com/app/pc/fc125acb88ce.png">
-                <div class="item-info">
-                  <div class="item-title">任务</div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <el-dialog width="30%" title="创建空白应用" :visible.sync="innerVisible" append-to-body>
-        <el-form :model="form" label-position="top" label-width="80px" size="small">
-          <el-form-item label="名称">
-            <el-input v-model="form.name" placeholder='给应用命名，例如‘‘客户管理系统’’'></el-input>
-          </el-form-item>
-          <el-form-item label="地址">
-            <el-input v-model="form.url" placeholder='应用访问地址，例如‘‘https://www.baidu.com/’’'></el-input>
-          </el-form-item>
-        </el-form>
-        <div slot="footer" class="dialog-footer">
-          <el-button @click="innerVisible = false" size="small">取 消</el-button>
-          <el-button type="primary" @click="innerVisible = false" size="small">确 定</el-button>
-        </div>
-      </el-dialog>
-    </el-dialog>
-    <el-dialog width="30%" title="编辑" :visible.sync="editVisible">
-      <el-form :model="form" label-position="top" label-width="80px" size="small">
-        <el-form-item label="名称">
-          <el-input v-model="form.name" placeholder='给应用命名，例如‘‘客户管理系统’’'></el-input>
-        </el-form-item>
-        <el-form-item label="地址" v-show="form.type == 1">
-          <el-input v-model="form.url" placeholder='应用访问地址，例如‘‘https://www.baidu.com/’’'></el-input>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="danger" @click="editVisible = false" size="small" style="float: left;">删 除</el-button>
-        <el-button @click="editVisible = false" size="small">取 消</el-button>
-        <el-button type="primary" @click="editVisible = false" size="small">确 定</el-button>
-      </div>
     </el-dialog>
     <el-dialog width="30%" title="切换企业/团队" :visible.sync="teamWorkVisible">
       <div class="switch-corp-pane">
         <div class="corp-block">
           <div class="corp-desc">我创建的企业/团队</div>
-          <div class="corp-wrapper" v-for="(item, index) in myTeamList" :key="index" @mouseover="showMyTeam = index" @mouseleave="showMyTeam = null">
+          <div class="corp-wrapper" v-for="(item, index) in myTeamList" :key="index" @mouseover="showMyTeam = index"
+            @mouseleave="showMyTeam = null">
             <div class="corp-item">
-              <div class="corp-name" :class="{'is-owner': item.actived}" :title="item.name">{{ item.name }}</div>
+              <div class="corp-name" :class="{ 'is-owner': item.actived }" :title="item.name">{{ item.name }}</div>
               <div class="corp-op">
                 <span class="op-current" v-show="item.actived">当前所在企业/团队</span>
-                <el-button v-show="!item.actived && showMyTeam == index" type="text" class="style-text" @click.stop="changeTeam(item)">
+                <el-button v-show="!item.actived && showMyTeam == index" type="text" class="style-text"
+                  @click.stop="changeTeam(item)">
                   <span>进入企业/团队<i class="el-icon-right"></i></span>
                 </el-button>
               </div>
@@ -87,17 +31,19 @@
           <el-button type="primary" plain class="corp-switch-btn" @click="joinOrCreateCorp('创建')">
             <span>创建企业/团队</span>
           </el-button>
-          
+
         </div>
         <div class="corp-block" style="margin-top: 10px;">
           <div class="corp-desc">我加入的企业/团队</div>
-         
-          <div class="corp-wrapper" v-for="(item, index) in joinTeamList" :key="index" @mouseover="showJoinTeam = index" @mouseleave="showJoinTeam = null">
+
+          <div class="corp-wrapper" v-for="(item, index) in joinTeamList" :key="index" @mouseover="showJoinTeam = index"
+            @mouseleave="showJoinTeam = null">
             <div class="corp-item">
               <div class="corp-name" :title="item.name">{{ item.name }}</div>
               <div class="corp-op">
                 <span class="op-current" v-show="item.actived">当前所在企业/团队</span>
-                <el-button v-show="!item.actived && showJoinTeam == index" type="text" class="style-text" @click.stop="changeTeam(item)">
+                <el-button v-show="!item.actived && showJoinTeam == index" type="text" class="style-text"
+                  @click.stop="changeTeam(item)">
                   <span>进入企业/团队<i class="el-icon-right"></i></span>
                 </el-button>
               </div>
@@ -124,42 +70,33 @@
       </el-dialog>
     </el-dialog>
     <el-dialog width="30%" :title="corpTitle + '企业/团队'" :visible.sync="joinOrCreateVisible" append-to-body>
-        <el-form :model="form" :rules="rules" ref="ruleForm" label-position="top" label-width="80px" size="small">
-          <el-form-item label="企业/团队名称" prop="name" v-if="corpTitle == '创建'">
-            <el-input v-model="form.name" placeholder='请输入你的企业/团队名称'></el-input>
-          </el-form-item>
-          <el-form-item label="邀请码" prop="tenantId" v-if="corpTitle == '加入'">
-            <el-input v-model="form.url" placeholder='请输入你的邀请码'></el-input>
-          </el-form-item>
-          <el-button size="small" type="primary" style="text-align: center;width: 100%;margin-top: 10px;"
-            @click="submitForm('ruleForm')">
-            {{ corpTitle }}
-          </el-button>
-        </el-form>
+      <el-form :model="form" :rules="rules" ref="ruleForm" label-position="top" label-width="80px" size="small">
+        <el-form-item label="企业/团队名称" prop="name" v-if="corpTitle == '创建'">
+          <el-input v-model="form.name" placeholder='请输入你的企业/团队名称'></el-input>
+        </el-form-item>
+        <el-form-item label="邀请码" prop="tenantId" v-if="corpTitle == '加入'">
+          <el-input v-model="form.url" placeholder='请输入你的邀请码'></el-input>
+        </el-form-item>
+        <el-button size="small" type="primary" style="text-align: center;width: 100%;margin-top: 10px;"
+          @click="submitForm('ruleForm')">
+          {{ corpTitle }}
+        </el-button>
+      </el-form>
     </el-dialog>
-
-    <el-drawer
-      title="消息管理"
-      :visible.sync="messageTable"
-      direction="btt"
-      size="50%">
-      <message-table/>
-    </el-drawer>
-    </div>
+  </div>
 </template>
 
 <script>
 import { mapGetters } from 'vuex'
-import { createTenant, joinTenant,getOwnCreateTenants,getOwnJoinTenants } from "@/api/system/tenant";
+import {setTenantId} from "@/utils/auth";
+import { createTenant, joinTenant, getOwnCreateTenants, getOwnJoinTenants } from "@/api/system/tenant";
 import store from '@/store'
 import Homebar from '@/layout/components/Homebar'
-import MessageTable from '@/components/MessageTable'
 
 export default {
-    name: 'Mayout',
+  name: 'Mayout',
   components: {
     Homebar,
-    MessageTable
   },
   data() {
     return {
@@ -169,7 +106,7 @@ export default {
       joinTeamList: [],
       corpTitle: '',
       form: {
-        type:1,
+        type: 1,
         name: '',
         tenantId: '',
       },
@@ -183,12 +120,8 @@ export default {
         ],
       },
       dialogVisible: false,
-      dialogVisibleApp: false,
-      innerVisible: false,
-      editVisible: false,
       teamWorkVisible: false,
       joinOrCreateVisible: false,
-      messageTable:false
     }
   },
   computed: {
@@ -214,13 +147,17 @@ export default {
       })
     },
     //切换企业
-    changeTeam(val){
+    changeTeam(val) {
       console.log(val);
       store.dispatch("ChangeTenant", val).then(() => {
-            this.$router.push({ path: "/" }).catch(() => {
-            });
-          }).catch(() => {
-          });
+        this.$modal.msgSuccess("切换成功");
+        setTenantId(val.id)
+        setTimeout(() => {
+          location.reload()
+        }, 2000)
+        .catch(() => {});
+      })
+      .catch(() => {});
     },
     joinOrCreateCorp(val) {
       this.corpTitle = val;
@@ -230,50 +167,27 @@ export default {
       this.$refs[formName].validate((valid) => {
         if (valid) {
           console.log(this.form);
-          if(this.corpTitle=='创建'){
-            createTenant({status:0,name:this.form.name}).then(response => {
+          if (this.corpTitle == '创建') {
+            createTenant({ status: 0, name: this.form.name }).then(response => {
               this.$modal.msgSuccess("创建成功");
             });
-            
+
           }
-          else{
-            joinTenant({tenantId:this.form.tenantId}).then(response => {
+          else {
+            joinTenant({ tenantId: this.form.tenantId }).then(response => {
               this.$modal.msgSuccess("加入成功");
             });
           }
           this.joinOrCreateVisible = false;
           this.getOwnJoinTenantList();
           this.getOwnCreateTenantList();
-          
+
         } else {
           console.log('error submit!!');
           return false;
         }
       });
     },
-    confirmAdd() {
-      this.$confirm('确定添加此应用?', '添加应用', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-      }).then(() => {
-        this.$message({
-          type: 'success',
-          message: '添加成功!'
-        });
-      }).catch(() => {
-
-      });
-    },
-    editApp(val) {
-      console.log(val);
-      this.form.type = val.type;
-      this.form.name = val.title;
-      this.form.url = val.path;
-      this.editVisible = true;
-    },
-    openAppList() {
-      this.dialogVisibleApp = true;
-    },
     fatherMethod() {
       this.dialogVisible = true;
     },
@@ -285,10 +199,11 @@ export default {
 </script>
 <style>
 .el-drawer__header {
-    color: black;
-    font-size: 20px;
-    font-weight: 500;
+  color: black;
+  font-size: 20px;
+  font-weight: 500;
 }
+
 .el-drawer__open .el-drawer.btt {
   height: auto !important;
   top: 45px;
@@ -296,8 +211,9 @@ export default {
 </style>
 <style lang="scss" scoped>
 .el-empty {
-    padding: 10px 0 !important;
+  padding: 10px 0 !important;
 }
+
 .fixed-header {
   position: fixed;
   top: 0;
@@ -317,6 +233,7 @@ export default {
   top: 60px;
   padding: 32px;
 }
+
 .switch-corp-pane {
   min-height: 400px;
 
@@ -332,17 +249,19 @@ export default {
       margin-bottom: 12px;
       max-height: 200px;
       overflow: auto;
-      
+
       .corp-item {
         align-items: center;
         display: flex;
         height: 50px;
         justify-content: space-between;
         line-height: 50px;
-        .is-owner{
+
+        .is-owner {
           font-size: 18px;
           font-weight: 700;
         }
+
         .corp-name {
           flex: auto;
           max-width: 350px;
@@ -354,9 +273,11 @@ export default {
 
         .corp-op {
           flex: none;
-          .style-text{
+
+          .style-text {
             padding: 0 16px;
           }
+
           .op-current {
             color: #838892;
             padding-right: 20px;

src/router/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 import Router from 'vue-router'
 /* Layout */
 import Layout from '@/layout'
+import Mayout from '@/mayout'
 
 Vue.use(Router)
 
@@ -108,9 +109,25 @@ export const constantRoutes = [
     component: (resolve) => require(['@/views/error/401'], resolve),
     hidden: true
   },
+  // {
+  //   path: '/',
+  //   component: (resolve) => require(['@/views/index'], resolve),
+  // },
   {
     path: '/',
-    component: (resolve) => require(['@/views/index'], resolve),
+    component: Mayout,
+    // redirect: 'user/profile',
+    hidden: true,
+    children: [
+      {
+        path: '/',
+        component: (resolve) => require(['@/views/index'], resolve),
+      },
+      {
+        path: '/user/profile',
+        component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
+      }
+    ]
   },
   // {
   //   path: '',

src/views/index.vue

@@ -1,9 +1,6 @@
 <template>
   <div>
-    <div class='fixed-header'>
-      <homebar />
-    </div>
-    <div class="dashboard-container">
+    <div class="container">
 
       <div v-if="tenantId==1" class="dashboard-no-corps">
         <div class="dashboard-no-corp-title">你当前没有任何企业</div>
@@ -94,9 +91,19 @@
       </div>
 
     </div>
-    <el-dialog width="30%" title="联系我们" :visible.sync="dialogVisible">
-      <img width="100%" src="@/assets/images/wx.jpg" alt="">
-
+    <el-dialog width="30%" :title="corpTitle + '企业/团队'" :visible.sync="joinOrCreateVisible" append-to-body>
+        <el-form :model="form" :rules="rules" ref="ruleForm" label-position="top" label-width="80px" size="small">
+          <el-form-item label="企业/团队名称" prop="name" v-if="corpTitle == '创建'">
+            <el-input v-model="form.name" placeholder='请输入你的企业/团队名称'></el-input>
+          </el-form-item>
+          <el-form-item label="邀请码" prop="tenantId" v-if="corpTitle == '加入'">
+            <el-input v-model="form.url" placeholder='请输入你的邀请码'></el-input>
+          </el-form-item>
+          <el-button size="small" type="primary" style="text-align: center;width: 100%;margin-top: 10px;"
+            @click="submitForm('ruleForm')">
+            {{ corpTitle }}
+          </el-button>
+        </el-form>
     </el-dialog>
     <el-dialog width="50%" title="新建应用" :visible.sync="dialogVisibleApp">
       <div class="scene-container">
@@ -155,81 +162,8 @@
         <el-button type="primary" @click="editVisible = false" size="small">确 定</el-button>
       </div>
     </el-dialog>
-    <el-dialog width="30%" title="切换企业/团队" :visible.sync="teamWorkVisible">
-      <div class="switch-corp-pane">
-        <div class="corp-block">
-          <div class="corp-desc">我创建的企业/团队</div>
-          <div class="corp-wrapper" v-for="(item, index) in myTeamList" :key="index" @mouseover="showMyTeam = index" @mouseleave="showMyTeam = null">
-            <div class="corp-item">
-              <div class="corp-name" :class="{'is-owner': item.actived}" :title="item.name">{{ item.name }}</div>
-              <div class="corp-op">
-                <span class="op-current" v-show="item.actived">当前所在企业/团队</span>
-                <el-button v-show="!item.actived && showMyTeam == index" type="text" class="style-text" @click.stop="changeTeam(item)">
-                  <span>进入企业/团队<i class="el-icon-right"></i></span>
-                </el-button>
-              </div>
-            </div>
-          </div>
-          <el-button type="primary" plain class="corp-switch-btn" @click="joinOrCreateCorp('创建')">
-            <span>创建企业/团队</span>
-          </el-button>
-          
-        </div>
-        <div class="corp-block" style="margin-top: 10px;">
-          <div class="corp-desc">我加入的企业/团队</div>
-         
-          <div class="corp-wrapper" v-for="(item, index) in joinTeamList" :key="index" @mouseover="showJoinTeam = index" @mouseleave="showJoinTeam = null">
-            <div class="corp-item">
-              <div class="corp-name" :title="item.name">{{ item.name }}</div>
-              <div class="corp-op">
-                <span class="op-current" v-show="item.actived">当前所在企业/团队</span>
-                <el-button v-show="!item.actived && showJoinTeam == index" type="text" class="style-text" @click.stop="changeTeam(item)">
-                  <span>进入企业/团队<i class="el-icon-right"></i></span>
-                </el-button>
-              </div>
-            </div>
-          </div>
-          <el-button type="primary" plain class="corp-switch-btn" @click="joinOrCreateCorp('加入')">
-            <span>加入企业/团队</span>
-          </el-button>
-        </div>
-      </div>
-      <el-dialog width="30%" :title="corpTitle + '企业/团队'" :visible.sync="joinOrCreateVisible" append-to-body>
-        <el-form :model="form" :rules="rules" ref="ruleForm" label-position="top" label-width="80px" size="small">
-          <el-form-item label="企业/团队名称" prop="name" v-if="corpTitle == '创建'">
-            <el-input v-model="form.name" placeholder='请输入你的企业/团队名称'></el-input>
-          </el-form-item>
-          <el-form-item label="邀请码" prop="tenantId" v-if="corpTitle == '加入'">
-            <el-input v-model="form.tenantId" placeholder='请输入你的邀请码'></el-input>
-          </el-form-item>
-          <el-button size="small" type="primary" style="text-align: center;width: 100%;margin-top: 10px;"
-            @click="submitForm('ruleForm')">
-            {{ corpTitle }}
-          </el-button>
-        </el-form>
-      </el-dialog>
-    </el-dialog>
-    <el-dialog width="30%" :title="corpTitle + '企业/团队'" :visible.sync="joinOrCreateVisible" append-to-body>
-        <el-form :model="form" :rules="rules" ref="ruleForm" label-position="top" label-width="80px" size="small">
-          <el-form-item label="企业/团队名称" prop="name" v-if="corpTitle == '创建'">
-            <el-input v-model="form.name" placeholder='请输入你的企业/团队名称'></el-input>
-          </el-form-item>
-          <el-form-item label="邀请码" prop="tenantId" v-if="corpTitle == '加入'">
-            <el-input v-model="form.url" placeholder='请输入你的邀请码'></el-input>
-          </el-form-item>
-          <el-button size="small" type="primary" style="text-align: center;width: 100%;margin-top: 10px;"
-            @click="submitForm('ruleForm')">
-            {{ corpTitle }}
-          </el-button>
-        </el-form>
-    </el-dialog>
-
-    <el-drawer
-      title="消息管理"
-      :visible.sync="messageTable"
-      direction="btt"
-      size="50%">
-      <message-table/>
+    <el-drawer title="消息管理" :visible.sync="messageTable" direction="btt" size="50%">
+      <message-table />
     </el-drawer>
   </div>
 </template>
@@ -238,7 +172,7 @@
 import { mapGetters } from 'vuex'
 import {setTenantId} from "@/utils/auth";
 import { getUnreadNotifyMessageList } from "@/api/system/notify/message";
-import { createTenant, joinTenant,changeTenant,getOwnCreateTenants,getOwnJoinTenants } from "@/api/system/tenant";
+import { createTenant, joinTenant,getOwnCreateTenants,getOwnJoinTenants } from "@/api/system/tenant";
 import router from '@/router'
 import store from '@/store'
 import Homebar from '@/layout/components/Homebar'
@@ -256,11 +190,6 @@ export default {
   },
   data() {
     return {
-      showMyTeam: null,
-      myTeamList: [],
-      showJoinTeam: null,
-      joinTeamList: [],
-      hasCorp:true,
       corpTitle: '',
       form: {
         type:1,
@@ -281,11 +210,9 @@ export default {
       // 列表
       notifyMessageList: [
       ],
-      dialogVisible: false,
       dialogVisibleApp: false,
       innerVisible: false,
       editVisible: false,
-      teamWorkVisible: false,
       joinOrCreateVisible: false,
       messageTable:false
     }
@@ -294,43 +221,14 @@ export default {
     ...mapGetters([
       'tenantId',
     ]),
-    topNav: {
-      get() {
-        return this.$store.state.settings.topNav
-      }
-    }
   },
   created() {
     this.getUnreadNotifyMessageList();
-    this.getOwnJoinTenantList();
-    this.getOwnCreateTenantList();
   },
   methods: {
-    // 获取我加入的租户列表
-    getOwnJoinTenantList() {
-      getOwnJoinTenants().then(response => {
-        this.joinTeamList = response.data;
-      })
-    },
-    // 获取我创建的租户列表
-    getOwnCreateTenantList() {
-      getOwnCreateTenants().then(response => {
-        this.myTeamList = response.data;
-      })
-    },
-    //切换企业
-    changeTeam(val){
-      console.log(val);
-      store.dispatch("ChangeTenant", val).then(() => {
-        setTenantId(val.id)
-        location.reload()
-        // this.$router.push({ path: "/" })
-        .catch(() => {});
-      })
-      .catch(() => {});
-    },
-     // 菜单选择事件
-     handleSelect(item) {
+
+     // 代办选择事件
+    handleSelect(item) {
       let key = item;
       const menus = [
         {
@@ -416,8 +314,6 @@ export default {
                 tenantId: '',
               };
               this.joinOrCreateVisible = false;
-              this.getOwnJoinTenantList();
-              this.getOwnCreateTenantList();
             });
           }
           else{
@@ -429,8 +325,6 @@ export default {
                 tenantId: '',
               };
               this.joinOrCreateVisible = false;
-              this.getOwnJoinTenantList();
-              this.getOwnCreateTenantList();
             });
           }
           
@@ -476,12 +370,6 @@ export default {
       //   name: 'MyNotifyMessage'
       // });
     },
-    fatherMethod() {
-      this.dialogVisible = true;
-    },
-    showTeamWork() {
-      this.teamWorkVisible = true;
-    },
   }
 }
 </script>

src/views/login.vue

@@ -199,6 +199,7 @@ export default {
             removePassword()
             removeRememberMe()
           }
+          // setTenantId(1)
           this.$store.dispatch(this.loginForm.loginType === "sms" ? "SmsLogin" : "Login", this.loginForm).then(() => {
             this.$router.push({path: "/"}).catch(() => {
             });

src/views/system/user/profile/index.vue

@@ -1,9 +1,9 @@
 <template>
-  <div>
+  <!-- <div>
     <div class='fixed-header'>
       <Userbar />
-    </div>
-  <div class="app-container">
+    </div> -->
+  <!-- <div class="app-container"> -->
     <el-row :gutter="20">
       <el-col :span="6" :xs="24">
         <el-card class="box-card">
@@ -66,8 +66,8 @@
         </el-card>
       </el-col>
     </el-row>
-  </div>
-  </div>
+  <!-- </div> -->
+  <!-- </div> -->
   
 </template>