sunlupeng 1 year ago
parent
commit
91c177a424
3 changed files with 402 additions and 13 deletions
  1. 375 0
      src/myout/index.vue
  2. 3 4
      src/store/modules/user.js
  3. 24 9
      src/views/index.vue

+ 375 - 0
src/myout/index.vue

@@ -0,0 +1,375 @@
+<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">
+      <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-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>
+    </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+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',
+  components: {
+    Homebar,
+    MessageTable
+  },
+  data() {
+    return {
+      showMyTeam: null,
+      myTeamList: [],
+      showJoinTeam: null,
+      joinTeamList: [],
+      corpTitle: '',
+      form: {
+        type:1,
+        name: '',
+        tenantId: '',
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入你的企业/团队名称', trigger: 'blur' },
+          // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
+        ],
+        tenantId: [
+          { required: true, message: '请输入你的邀请码', trigger: 'blur' },
+        ],
+      },
+      dialogVisible: false,
+      dialogVisibleApp: false,
+      innerVisible: false,
+      editVisible: false,
+      teamWorkVisible: false,
+      joinOrCreateVisible: false,
+      messageTable:false
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'tenantId',
+    ]),
+  },
+  created() {
+    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(() => {
+            this.$router.push({ path: "/" }).catch(() => {
+            });
+          }).catch(() => {
+          });
+    },
+    joinOrCreateCorp(val) {
+      this.corpTitle = val;
+      this.joinOrCreateVisible = true;
+    },
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          console.log(this.form);
+          if(this.corpTitle=='创建'){
+            createTenant({status:0,name:this.form.name}).then(response => {
+              this.$modal.msgSuccess("创建成功");
+            });
+            
+          }
+          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;
+    },
+    showTeamWork() {
+      this.teamWorkVisible = true;
+    },
+  }
+}
+</script>
+<style>
+.el-drawer__header {
+    color: black;
+    font-size: 20px;
+    font-weight: 500;
+}
+.el-drawer__open .el-drawer.btt {
+  height: auto !important;
+  top: 45px;
+}
+</style>
+<style lang="scss" scoped>
+.el-empty {
+    padding: 10px 0 !important;
+}
+.fixed-header {
+  position: fixed;
+  top: 0;
+  right: 0;
+  z-index: 9;
+  width: 100%;
+  transition: width 0.28s;
+}
+
+.app-main {
+  background: #f5f6f8;
+  bottom: 0;
+  left: 0;
+  overflow: auto;
+  position: absolute;
+  right: 0;
+  top: 60px;
+  padding: 32px;
+}
+.switch-corp-pane {
+  min-height: 400px;
+
+  .corp-block {
+    .corp-desc {
+      color: #525967;
+      margin-bottom: 10px;
+    }
+
+    .corp-wrapper {
+      border-radius: 4px;
+      box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .1);
+      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{
+          font-size: 18px;
+          font-weight: 700;
+        }
+        .corp-name {
+          flex: auto;
+          max-width: 350px;
+          overflow: hidden;
+          padding: 0 30px;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        .corp-op {
+          flex: none;
+          .style-text{
+            padding: 0 16px;
+          }
+          .op-current {
+            color: #838892;
+            padding-right: 20px;
+          }
+        }
+      }
+    }
+
+    .corp-switch-btn {
+      text-align: center;
+      width: 100%;
+    }
+
+  }
+}
+</style>

+ 3 - 4
src/store/modules/user.js

@@ -125,11 +125,10 @@ const user = {
       })
       })
     },
     },
 
 
-    ChangeTenant({ commit }, userInfo) {
-      const mobile = userInfo.mobile.trim()
-      const mobileCode = userInfo.mobileCode
+    ChangeTenant({ commit }, val) {
+      const corpId = val.corpId
       return new Promise((resolve, reject) => {
       return new Promise((resolve, reject) => {
-        changeTenant(mobile, mobileCode).then(res => {
+        changeTenant({corpId:corpId}).then(res => {
           res = res.data;
           res = res.data;
           // 设置 token
           // 设置 token
           setToken(res)
           setToken(res)

+ 24 - 9
src/views/index.vue

@@ -236,6 +236,7 @@
 
 
 <script>
 <script>
 import { mapGetters } from 'vuex'
 import { mapGetters } from 'vuex'
+import {setTenantId} from "@/utils/auth";
 import { getUnreadNotifyMessageList } from "@/api/system/notify/message";
 import { getUnreadNotifyMessageList } from "@/api/system/notify/message";
 import { createTenant, joinTenant,changeTenant,getOwnCreateTenants,getOwnJoinTenants } from "@/api/system/tenant";
 import { createTenant, joinTenant,changeTenant,getOwnCreateTenants,getOwnJoinTenants } from "@/api/system/tenant";
 import router from '@/router'
 import router from '@/router'
@@ -321,10 +322,12 @@ export default {
     changeTeam(val){
     changeTeam(val){
       console.log(val);
       console.log(val);
       store.dispatch("ChangeTenant", val).then(() => {
       store.dispatch("ChangeTenant", val).then(() => {
-            this.$router.push({ path: "/" }).catch(() => {
-            });
-          }).catch(() => {
-          });
+        setTenantId(val.id)
+        location.reload()
+        // this.$router.push({ path: "/" })
+        .catch(() => {});
+      })
+      .catch(() => {});
     },
     },
      // 菜单选择事件
      // 菜单选择事件
      handleSelect(item) {
      handleSelect(item) {
@@ -407,17 +410,29 @@ export default {
           if(this.corpTitle=='创建'){
           if(this.corpTitle=='创建'){
             createTenant({status:0,name:this.form.name}).then(response => {
             createTenant({status:0,name:this.form.name}).then(response => {
               this.$modal.msgSuccess("创建成功");
               this.$modal.msgSuccess("创建成功");
+              this.form= {
+                type:1,
+                name: '',
+                tenantId: '',
+              };
+              this.joinOrCreateVisible = false;
+              this.getOwnJoinTenantList();
+              this.getOwnCreateTenantList();
             });
             });
-            
           }
           }
           else{
           else{
-            joinTenant({tenantId:this.form.tenantId}).then(response => {
+            joinTenant({accountMode:1,corpId:this.form.tenantId}).then(response => {
               this.$modal.msgSuccess("加入成功");
               this.$modal.msgSuccess("加入成功");
+              this.form= {
+                type:1,
+                name: '',
+                tenantId: '',
+              };
+              this.joinOrCreateVisible = false;
+              this.getOwnJoinTenantList();
+              this.getOwnCreateTenantList();
             });
             });
           }
           }
-          this.joinOrCreateVisible = false;
-          this.getOwnJoinTenantList();
-          this.getOwnCreateTenantList();
           
           
         } else {
         } else {
           console.log('error submit!!');
           console.log('error submit!!');