clay : 用户登录从简

flowable-engine-web/src/views/Index.vue

@@ -2,17 +2,13 @@
   <div style="text-align: center">
     <!--    <h4>先选择本次登录人员的身份，再进入相应的系统 😅</h4>-->
     <h4>欢迎进入Spring Security 配套 Workflow工作流模块</h4>
-    <div v-if="!token">
-      <el-input v-model="username"/>
-      <el-button @click="getToken">登录</el-button>
-    </div>
     <div class="work-panel">
-      <!--      <div class="user">-->
-      <!--        <el-button type="primary" round size="small" @click="showRolePicker()" icon="el-icon-user">选择本次登录者</el-button>-->
-      <!--        <div v-if="loginUser !== '' && loginUser !== null">-->
-      <!--          <span>{{ loginUser.name }}</span>-->
-      <!--        </div>-->
-      <!--      </div>-->
+      <div class="user">
+        <el-button type="primary" round size="small" @click="showRolePicker()" icon="el-icon-user">选择本次登录者</el-button>
+        <div v-if="token !== '' && token !== null">
+          <span>{{ loginUser.name }}</span>
+        </div>
+      </div>
       <div class="panel">
         <div class="panel-item" @click="to('/workSpace')">
           <div>
@@ -34,73 +30,21 @@
         </div>
       </div>
     </div>
+    <user-picker title="请选择系统角色" :multiple="false" ref="userPicker" :v-model="select" @ok="selectedUser"/>
   </div>
 </template>
 
 <script>
 import axios from "axios";
+import UserPicker from "../components/common/UserPicker";
 
 export default {
   name: "Index",
+  components: {UserPicker},
   data() {
     return {
-      cmCode:"",
-      cmOptions:{
-        tabSize: 4, // tab
-        indentUnit: 4,
-        styleActiveLine: true, // 高亮选中行
-        lineNumbers: true, // 显示行号
-        styleSelectedText: true,
-        line: true,
-        foldGutter: true, // 块槽
-        gutters: ['CodeMirror-linenumbers', "lock", "warn"],
-        highlightSelectionMatches: { showToken: /w/, annotateScrollbar: true }, // 可以启用该选项来突出显示当前选中的内容的所有实例
-        mode:'javascript',
-        // hint.js options
-        hintOptions: {
-          // 当匹配只有一项的时候是否自动补全
-          completeSingle: false
-        },
-        // 快捷键 可提供三种模式 sublime、emacs、vim
-        keyMap: 'sublime',
-        matchBrackets: true,
-        showCursorWhenSelecting: false,
-        // scrollbarStyle:null,
-        // readOnly:true,  //是否只读
-        theme: 'material', // 主题 material
-        extraKeys: { 'Ctrl': 'autocomplete' }, // 可以用于为编辑器指定额外的键绑定，以及keyMap定义的键绑定
-        lastLineBefore:0
-      },
-      cmOptionss:{
-        value:'',//编辑器的起始值。可以是字符串，也可以是文档对象。
-        mode:"text/x-hive",//第一个将模式名称映射到它们的构造函数，第二个将MIME类型映射到模式规范。
-        theme: "liquibyte",//编辑器样式的主题
-        indentWithTabs: true,//在缩进时，是否tabSize 应该用N个制表符替换前N *个空格。默认值为false。
-        smartIndent: true,//是否使用模式提供的上下文相关缩进（或者只是缩进与之前的行相同）。默认为true。
-        lineNumbers: true,//是否在编辑器左侧显示行号。
-        matchBrackets : true,//括号匹配
-        autofocus: true,//可用于使CodeMirror将焦点集中在初始化上
-        extraKeys: {"Ctrl-Space": "autocomplete"},//按键配置
-        hintOptions: {tables: {
-            users: ["name", "score", "birthDate"],
-            countries: ["name", "population", "size"]
-          }}
-      },
       token: localStorage.getItem("token"),
-      username: null,
       select: [],
-      roleData: [
-        {
-          roleId: 1,
-          roleName: "角色名称",
-        }
-      ],
-      deptData: [
-        {
-          deptId: 1,
-          deptName: "角色名称",
-        }
-      ],
       loginUser: {
         id: 381496,
         name: "clay",
@@ -119,16 +63,14 @@ export default {
   },
   methods: {
     getToken() {
+      localStorage.clear()
       axios.post(
-          // "http://security-react.mytwins.top/auth/login",
-          // getBaseUrl()+"/auth/login",
-          "http://gateway.mytwins.top/auth/login",
-          // "http://localhost:8000/auth/login",
+          // "http://gateway.mytwins.top/auth/workflow/login",
+          "http://localhost:8000/auth/workflow/login",
           {
             code: "string",
             password: "926425",
-            // username: "admin",
-            username: this.username,
+            username: this.loginUser.id,
             uuid: "string"
           }
       ).then(res => {
@@ -137,20 +79,27 @@ export default {
         localStorage.setItem("token", this.token)
       })
     },
-
-
+    selectedUser(select) {
+      let userInfoList = []
+      for (let val of select) {
+        let userInfo = {
+          id: val.id,
+          name: val.name,
+          avatar: val.avatar,
+        }
+        this.loginUser = userInfo;
+        userInfoList.push(userInfo)
+      }
+      this.getToken()
+      this.select = userInfoList;
+    },
     //显示角色选择框
     showRolePicker() {
-      this.$refs.orgPicker.visible = true
-    },
-    selected(select) {
-      this.select = select
-      this.loginUser = select.length > 0 ? select[0] : ''
-      this.showUserSelect = false
-      sessionStorage.setItem("user", JSON.stringify(this.loginUser))
+      localStorage.clear()
+      this.$refs.userPicker.showUserPicker()
     },
     to(path) {
-      if (this.loginUser === null || this.loginUser === '') {
+      if (this.token === null || this.token === '' || this.token === 'undefined') {
         this.$message.warning("请先选择一个人员身份进行登录")
       } else {
         this.$router.push(path)