up

src/styles/element-ui-reset/el-button.scss

@@ -0,0 +1,5 @@
+.el-button--mini {
+  padding: 7px 7px;
+  font-size: 12px;
+  border-radius: 3px;
+}

src/styles/element-ui-reset/el-switch.scss

@@ -1,5 +1,26 @@
+
+.el-switch {
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  font-size: 12px;
+  line-height: 20px;
+  height: 20px;
+  vertical-align: middle;
+}
+
+.el-switch__label * {
+  line-height: 1;
+  font-size: 12px;
+  display: inline-block;
+}
+
 .el-switch__label,.el-switch__label--left{
   color: #FFF;
+  font-size: 12px;
 }
 
 .el-switch__core {

src/styles/element-ui-reset/index.scss

@@ -2,6 +2,7 @@
 @import "./ql-editor.scss";
 
 // element-ui
+@import "./el-button.scss";
 @import "./el-dialog.scss";
 @import "./el-table.scss";
 @import "./el-drawer.scss";

src/styles/element-ui.scss

@@ -94,4 +94,4 @@
 }
 .el-menu-item i,.el-submenu__title i{
   color: #fff;
-}
+}

src/views/system/group/user/BindWx.vue

@@ -0,0 +1,95 @@
+<template>
+  <el-dialog
+    :title="title"
+    :visible.sync="dialogVisible"
+    width="30%"
+    destroy-on-close
+    :close-on-click-modal="false"
+  >
+    <div class="content-container">
+      <el-row type="flex" justify="center" align="middle">
+        <div id="qrcodetemplate" ref="qrcodetemplate" style="margin: 5px 0;" />
+      </el-row>
+      <el-row type="flex" justify="center">
+        <span>{{ viewData.note }}</span>
+      </el-row>
+    </div>
+  </el-dialog>
+</template>
+<script>
+
+import { serverUrl, devServerUrl } from '@/settings'
+import QRCode from 'qrcodejs2'
+import { mapGetters } from 'vuex'
+import { isNotNull } from '@/utils'
+
+export default {
+  name: 'BindWx',
+  props: {
+    title: {
+      type: String,
+      default: '微信绑定'
+    }
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      userId: undefined,
+      code: '',
+      viewData: {
+        note: ''
+      }
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'userData'
+    ])
+  },
+  created() {
+
+  },
+  methods: {
+
+    // 外部调用接口
+    show(userId, objCode) {
+      this.userId = userId
+      if (isNotNull(objCode)) {
+        this.viewData.note = '已有绑定'
+      } else {
+        this.viewData.note = '未绑定微信'
+      }
+      this.dialogVisible = true
+      this.drawQrcode()
+    },
+
+    // 显示绑定二维码
+    drawQrcode() {
+      const ocId = this.userData.ocId
+      const userId = this.userId
+
+      const baseURL = process.env.NODE_ENV === 'development' ? devServerUrl : serverUrl
+      const url = baseURL + '/wx/auth/' + ocId + '/' + userId
+      if (!url) {
+        this.$message.error('没有生产二维码的参数')
+        return
+      }
+      this.$nextTick(() => {
+        this.$refs.qrcodetemplate.innerHTML = ''
+        new QRCode('qrcodetemplate', {
+          width: 200,
+          height: 200,
+          text: url.toString()
+        })
+      })
+    }
+  }
+}
+</script>
+<style lang="scss">
+#qrcodetemplate{
+  width: 200px;
+  height: 200px;
+  margin: 0 auto;
+}
+</style>

src/views/system/group/user/userList.vue

@@ -7,10 +7,10 @@
         </div>
       </el-col>
       <el-col :span="16" class="right">
-        <el-input v-model="conditions.keywords" class="search-input m-right-15" placeholder="请输入内容">
-          <el-button slot="append" icon="el-icon-search" @click="getData()" />
+        <el-input v-model="conditions.keywords" class="search-input m-right-15" size="mini" placeholder="请输入内容">
+          <el-button slot="append" icon="el-icon-search" size="mini" @click="getData()" />
         </el-input>
-        <el-button type="primary" @click="handleAddUser">新增用户</el-button>
+        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAddUser">账号</el-button>
       </el-col>
     </el-row>
 
@@ -62,25 +62,24 @@
 
         <el-table-column align="center" label="状态" width="140">
           <template v-slot="{row}">
-            <div v-if="row.isFixed != 1">
+            <div v-if="row.isFixed !== 1">
               <el-switch
                 v-model="row.status"
                 active-text="正常"
                 inactive-text="锁定"
                 :active-value="1"
                 :inactive-value="2"
-                size="mini"
                 @change="(status)=>handlerChangeUserStatus(status, row)"
               />
             </div>
           </template>
         </el-table-column>
 
-        <el-table-column label="操作" header-align="center" align="center" width="240">
+        <el-table-column label="操作" header-align="center" align="center" width="200">
           <template v-slot="{row}">
             <el-button size="mini" @click="handleEditUser(row)">修改</el-button>
             <el-button v-if="row.isFixed !== 1" size="mini" type="danger" @click="handleDeleteUser(row)">删除</el-button>
-            <el-dropdown v-if="row.isFixed != 1" class="el-dropdown-link" @command="(command)=>handlerCommand(command, row)">
+            <el-dropdown v-if="row.isFixed !== 1" class="el-dropdown-link" @command="(command)=>handlerCommand(command, row)">
               <el-button size="mini" type="primary">
                 更多<i class="el-icon-arrow-down el-icon--right" />
               </el-button>
@@ -94,6 +93,7 @@
                 </template>
                 <el-dropdown-item command="resetPwd">重置密码</el-dropdown-item>
                 <el-dropdown-item command="handlePermit">权限配置</el-dropdown-item>
+                <el-dropdown-item command="bindWx">微信绑定</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </template>
@@ -110,24 +110,26 @@
     <grant-group ref="AddGrantGroup" title="添加授权" @formSuccess="getData" />
     <grant-group ref="EditGrantGroup" title="变更授权" @formSuccess="getData" />
     <account-permit ref="AccountPermit" title="权限配置" />
+    <BindWx ref="BindWx" />
   </div>
 </template>
 
 <script>
-import Pagination from '@/components/Pagination' // secondary package based on el-pagination
+import Pagination from '@/components/Pagination'
 import AccountPermit from '@/views/system/permit/account'
 import GrantGroup from './grantGroup'
 import User from './user'
+import BindWx from './BindWx.vue'
 import { deleteUserById, getUserByPage, resetPassword, updateUserStatus } from '@/api/system/userApi'
 import { mapGetters } from 'vuex'
 
 export default {
   name: 'UserList',
-  components: { Pagination, User, GrantGroup, AccountPermit },
+  components: { Pagination, User, GrantGroup, AccountPermit, BindWx },
   props: { },
   data() {
     return {
-      title: '用户管理',
+      title: '账号管理',
       dataList: [],
       total: 0,
       listLoading: false,
@@ -188,6 +190,11 @@ export default {
         case 'handlePermit':
           this.handlePermit(data)
           break
+
+        case 'bindWx':
+          console.log('bindWx')
+          this.handleWinXin(data)
+          break
       }
     },
 
@@ -255,6 +262,12 @@ export default {
       this.$refs['AccountPermit'].showModel(accountId, positionId)
     },
 
+    // 微信绑定
+    handleWinXin(data) {
+      const { accountId, wxCode } = data
+      this.$refs.BindWx.show(accountId, wxCode)
+    },
+
     // Click "Delete" User
     handleDeleteUser(data) {
       this.$confirm('此操作将永久删除该账号, 是否继续?', '提示', {