Explorar o código

refactor:用户管理调整

SJ hai 3 días
pai
achega
1c747d48e9
Modificáronse 3 ficheiros con 1075 adicións e 1075 borrados
  1. 391 391
      src/views/system/UserList.vue
  2. 525 525
      src/views/system/modules/UserModal.vue
  3. 159 159
      src/views/user/LoginAccount.vue

+ 391 - 391
src/views/system/UserList.vue

@@ -1,392 +1,392 @@
-<template>
-  <a-card :bordered="false">
-
-    <!-- 查询区域 -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row :gutter="24">
-
-          <a-col :md="6" :sm="12">
-            <a-form-item label="账号">
-              <!--<a-input placeholder="请输入账号查询" v-model="queryParam.username"></a-input>-->
-              <j-input placeholder="输入账号模糊查询" v-model="queryParam.username"></j-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="性别">
-              <a-select v-model="queryParam.sex" placeholder="请选择性别">
-                <a-select-option value="">请选择</a-select-option>
-                <a-select-option value="1">男</a-select-option>
-                <a-select-option value="2">女</a-select-option>
-              </a-select>
-            </a-form-item>
-          </a-col>
-
-
-          <template v-if="toggleSearchStatus">
-            <a-col :md="6" :sm="8">
-              <a-form-item label="真实名字">
-                <a-input placeholder="请输入真实名字" v-model="queryParam.realname"></a-input>
-              </a-form-item>
-            </a-col>
-
-            <a-col :md="6" :sm="8">
-              <a-form-item label="手机号码">
-                <a-input placeholder="请输入手机号码查询" v-model="queryParam.phone"></a-input>
-              </a-form-item>
-            </a-col>
-
-            <a-col :md="6" :sm="8">
-              <a-form-item label="用户状态">
-                <a-select v-model="queryParam.status" placeholder="请选择">
-                  <a-select-option value="">请选择</a-select-option>
-                  <a-select-option value="1">正常</a-select-option>
-                  <a-select-option value="2">冻结</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </template>
-
-          <a-col :md="6" :sm="8">
-            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
-              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
-              <a @click="handleToggleSearch" style="margin-left: 8px">
-                {{ toggleSearchStatus ? '收起' : '展开' }}
-                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
-              </a>
-            </span>
-          </a-col>
-
-        </a-row>
-      </a-form>
-    </div>
-
-    <!-- 操作按钮区域 -->
-    <div class="table-operator" style="border-top: 5px">
-      <a-button @click="handleAdd" type="primary" icon="plus" >添加用户</a-button>
-      <a-button type="primary" icon="download" @click="handleExportXls('用户信息')">导出</a-button>
-      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
-        <a-button type="primary" icon="import">导入</a-button>
-      </a-upload>
-      <j-third-app-button biz-type="user" :selected-row-keys="selectedRowKeys" syncToApp syncToLocal @sync-finally="onSyncFinally"/>
-      <a-button type="primary" icon="hdd" @click="recycleBinVisible=true">回收站</a-button>
-      <a-dropdown v-if="selectedRowKeys.length > 0">
-        <a-menu slot="overlay" @click="handleMenuClick">
-          <a-menu-item key="1">
-            <a-icon type="delete" @click="batchDel"/>
-            删除
-          </a-menu-item>
-          <a-menu-item key="2">
-            <a-icon type="lock" @click="batchFrozen('2')"/>
-            冻结
-          </a-menu-item>
-          <a-menu-item key="3">
-            <a-icon type="unlock" @click="batchFrozen('1')"/>
-            解冻
-          </a-menu-item>
-        </a-menu>
-        <a-button style="margin-left: 8px">
-          批量操作
-          <a-icon type="down"/>
-        </a-button>
-      </a-dropdown>
-      <j-super-query :fieldList="superQueryFieldList" @handleSuperQuery="handleSuperQuery"/>
-    </div>
-
-    <!-- table区域-begin -->
-    <div>
-      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
-        <i class="anticon anticon-info-circle ant-alert-icon"></i>已选择&nbsp;<a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项&nbsp;&nbsp;
-        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
-      </div>
-
-      <a-table
-        ref="table"
-        bordered
-        size="middle"
-        rowKey="id"
-        :columns="columns"
-        :dataSource="dataSource"
-        :pagination="ipagination"
-        :loading="loading"
-        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-        @change="handleTableChange">
-
-        <template slot="avatarslot" slot-scope="text, record, index">
-          <div class="anty-img-wrap">
-            <a-avatar shape="square" :src="getAvatarView(record.avatar)" icon="user"/>
-          </div>
-        </template>
-
-        <span slot="action" slot-scope="text, record">
-          <a @click="handleEdit(record)" >编辑</a>
-
-          <a-divider type="vertical" />
-
-          <a-dropdown>
-            <a class="ant-dropdown-link">
-              更多 <a-icon type="down"/>
-            </a>
-            <a-menu slot="overlay">
-              <a-menu-item>
-                <a href="javascript:;" @click="handleDetail(record)">详情</a>
-              </a-menu-item>
-
-              <a-menu-item>
-                <a href="javascript:;" @click="handleChangePassword(record.username)">密码</a>
-              </a-menu-item>
-
-              <a-menu-item>
-                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
-                  <a>删除</a>
-                </a-popconfirm>
-              </a-menu-item>
-
-              <a-menu-item v-if="record.status==1">
-                <a-popconfirm title="确定冻结吗?" @confirm="() => handleFrozen(record.id,2,record.username)">
-                  <a>冻结</a>
-                </a-popconfirm>
-              </a-menu-item>
-
-              <a-menu-item v-if="record.status==2">
-                <a-popconfirm title="确定解冻吗?" @confirm="() => handleFrozen(record.id,1,record.username)">
-                  <a>解冻</a>
-                </a-popconfirm>
-              </a-menu-item>
-
-            </a-menu>
-          </a-dropdown>
-        </span>
-
-
-      </a-table>
-    </div>
-    <!-- table区域-end -->
-
-    <user-modal ref="modalForm" @ok="modalFormOk"></user-modal>
-
-    <password-modal ref="passwordmodal" @ok="passwordModalOk"></password-modal>
-
-    <sys-user-agent-modal ref="sysUserAgentModal"></sys-user-agent-modal>
-
-    <!-- 用户回收站 -->
-    <user-recycle-bin-modal :visible.sync="recycleBinVisible" @ok="modalFormOk"/>
-
-  </a-card>
-</template>
-
-<script>
-  import UserModal from './modules/UserModal'
-  import PasswordModal from './modules/PasswordModal'
-  import {putAction,getFileAccessHttpUrl} from '@/api/manage';
-  import {frozenBatch} from '@/api/api'
-  import {JeecgListMixin} from '@/mixins/JeecgListMixin'
-  import SysUserAgentModal from "./modules/SysUserAgentModal";
-  import JInput from '@/components/jeecg/JInput'
-  import UserRecycleBinModal from './modules/UserRecycleBinModal'
-  import JSuperQuery from '@/components/jeecg/JSuperQuery'
-  import JThirdAppButton from '@/components/jeecgbiz/thirdApp/JThirdAppButton'
-
-  export default {
-    name: "UserList",
-    mixins: [JeecgListMixin],
-    components: {
-      JThirdAppButton,
-      SysUserAgentModal,
-      UserModal,
-      PasswordModal,
-      JInput,
-      UserRecycleBinModal,
-      JSuperQuery
-    },
-    data() {
-      return {
-        description: '这是用户管理页面',
-        queryParam: {},
-        recycleBinVisible: false,
-        columns: [
-          /*{
-            title: '#',
-            dataIndex: '',
-            key:'rowIndex',
-            width:60,
-            align:"center",
-            customRender:function (t,r,index) {
-              return parseInt(index)+1;
-            }
-          },*/
-          {
-            title: '用户账号',
-            align: "center",
-            dataIndex: 'username',
-            width: 120,
-            sorter: true
-          },
-          {
-            title: '用户姓名',
-            align: "center",
-            width: 100,
-            dataIndex: 'realname',
-          },
-          {
-            title: '头像',
-            align: "center",
-            width: 120,
-            dataIndex: 'avatar',
-            scopedSlots: {customRender: "avatarslot"}
-          },
-
-          {
-            title: '性别',
-            align: "center",
-            width: 80,
-            dataIndex: 'sex_dictText',
-            sorter: true
-          },
-          {
-            title: '生日',
-            align: "center",
-            width: 100,
-            dataIndex: 'birthday'
-          },
-          {
-            title: '手机号码',
-            align: "center",
-            width: 100,
-            dataIndex: 'phone'
-          },
-          {
-            title: '部门',
-            align: "center",
-            width: 180,
-            dataIndex: 'orgCodeTxt'
-          },
-          {
-            title: '负责部门',
-            align: "center",
-            width: 180,
-            dataIndex: 'departIds_dictText'
-          },
-          {
-            title: '状态',
-            align: "center",
-            width: 80,
-            dataIndex: 'status_dictText'
-          },
-          {
-            title: '操作',
-            dataIndex: 'action',
-            scopedSlots: {customRender: 'action'},
-            align: "center",
-            width: 170
-          }
-
-        ],
-        superQueryFieldList: [
-          { type: 'input', value: 'username', text: '用户账号', },
-          { type: 'input', value: 'realname', text: '用户姓名', },
-          { type: 'select', value: 'sex', dbType: 'int', text: '性别', dictCode: 'sex' },
-        ],
-        url: {
-          syncUser: "/act/process/extActProcess/doSyncUser",
-          list: "/sys/user/list",
-          delete: "/sys/user/delete",
-          deleteBatch: "/sys/user/deleteBatch",
-          exportXlsUrl: "/sys/user/exportXls",
-          importExcelUrl: "sys/user/importExcel",
-        },
-      }
-    },
-    computed: {
-      importExcelUrl: function(){
-        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
-      }
-    },
-    methods: {
-      getAvatarView: function (avatar) {
-        return getFileAccessHttpUrl(avatar)
-      },
-
-      batchFrozen: function (status) {
-        if (this.selectedRowKeys.length <= 0) {
-          this.$message.warning('请选择一条记录!');
-          return false;
-        } else {
-          let ids = "";
-          let that = this;
-          let isAdmin = false;
-          that.selectionRows.forEach(function (row) {
-            if (row.username == 'admin') {
-              isAdmin = true;
-            }
-          });
-          if (isAdmin) {
-            that.$message.warning('管理员账号不允许此操作,请重新选择!');
-            return;
-          }
-          that.selectedRowKeys.forEach(function (val) {
-            ids += val + ",";
-          });
-          that.$confirm({
-            title: "确认操作",
-            content: "是否" + (status == 1 ? "解冻" : "冻结") + "选中账号?",
-            onOk: function () {
-              frozenBatch({ids: ids, status: status}).then((res) => {
-                if (res.success) {
-                  that.$message.success(res.message);
-                  that.loadData();
-                  that.onClearSelected();
-                } else {
-                  that.$message.warning(res.message);
-                }
-              });
-            }
-          });
-        }
-      },
-      handleMenuClick(e) {
-        if (e.key == 1) {
-          this.batchDel();
-        } else if (e.key == 2) {
-          this.batchFrozen(2);
-        } else if (e.key == 3) {
-          this.batchFrozen(1);
-        }
-      },
-      handleFrozen: function (id, status, username) {
-        let that = this;
-        //TODO 后台校验管理员角色
-        if ('admin' == username) {
-          that.$message.warning('管理员账号不允许此操作!');
-          return;
-        }
-        frozenBatch({ids: id, status: status}).then((res) => {
-          if (res.success) {
-            that.$message.success(res.message);
-            that.loadData();
-          } else {
-            that.$message.warning(res.message);
-          }
-        });
-      },
-      handleChangePassword(username) {
-        this.$refs.passwordmodal.show(username);
-      },
-      passwordModalOk() {
-        //TODO 密码修改完成 不需要刷新页面,可以把datasource中的数据更新一下
-      },
-      onSyncFinally({isToLocal}) {
-        // 同步到本地时刷新下数据
-        if (isToLocal) {
-          this.loadData()
-        }
-      },
-    }
-
-  }
-</script>
-<style scoped>
-  @import '~@assets/less/common.less'
+<template>
+  <a-card :bordered="false">
+
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+
+          <a-col :md="6" :sm="12">
+            <a-form-item label="账号">
+              <!--<a-input placeholder="请输入账号查询" v-model="queryParam.username"></a-input>-->
+              <j-input placeholder="输入账号模糊查询" v-model="queryParam.username"></j-input>
+            </a-form-item>
+          </a-col>
+
+          <!-- <a-col :md="6" :sm="8">
+            <a-form-item label="性别">
+              <a-select v-model="queryParam.sex" placeholder="请选择性别">
+                <a-select-option value="">请选择</a-select-option>
+                <a-select-option value="1">男</a-select-option>
+                <a-select-option value="2">女</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col> -->
+
+
+          <template v-if="toggleSearchStatus">
+            <a-col :md="6" :sm="8">
+              <a-form-item label="真实名字">
+                <a-input placeholder="请输入真实名字" v-model="queryParam.realname"></a-input>
+              </a-form-item>
+            </a-col>
+
+            <!-- <a-col :md="6" :sm="8">
+              <a-form-item label="手机号码">
+                <a-input placeholder="请输入手机号码查询" v-model="queryParam.phone"></a-input>
+              </a-form-item>
+            </a-col> -->
+
+            <a-col :md="6" :sm="8">
+              <a-form-item label="用户状态">
+                <a-select v-model="queryParam.status" placeholder="请选择">
+                  <a-select-option value="">请选择</a-select-option>
+                  <a-select-option value="1">正常</a-select-option>
+                  <a-select-option value="2">冻结</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+          </template>
+
+          <a-col :md="6" :sm="8">
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
+              <a @click="handleToggleSearch" style="margin-left: 8px">
+                {{ toggleSearchStatus ? '收起' : '展开' }}
+                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
+              </a>
+            </span>
+          </a-col>
+
+        </a-row>
+      </a-form>
+    </div>
+
+    <!-- 操作按钮区域 -->
+    <div class="table-operator" style="border-top: 5px">
+      <a-button @click="handleAdd" type="primary" icon="plus" >添加用户</a-button>
+      <!-- <a-button type="primary" icon="download" @click="handleExportXls('用户信息')">导出</a-button>
+      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
+        <a-button type="primary" icon="import">导入</a-button>
+      </a-upload>
+      <j-third-app-button biz-type="user" :selected-row-keys="selectedRowKeys" syncToApp syncToLocal @sync-finally="onSyncFinally"/>
+      <a-button type="primary" icon="hdd" @click="recycleBinVisible=true">回收站</a-button> -->
+      <a-dropdown v-if="selectedRowKeys.length > 0">
+        <a-menu slot="overlay" @click="handleMenuClick">
+          <a-menu-item key="1">
+            <a-icon type="delete" @click="batchDel"/>
+            删除
+          </a-menu-item>
+          <a-menu-item key="2">
+            <a-icon type="lock" @click="batchFrozen('2')"/>
+            冻结
+          </a-menu-item>
+          <a-menu-item key="3">
+            <a-icon type="unlock" @click="batchFrozen('1')"/>
+            解冻
+          </a-menu-item>
+        </a-menu>
+        <a-button style="margin-left: 8px">
+          批量操作
+          <a-icon type="down"/>
+        </a-button>
+      </a-dropdown>
+      <j-super-query :fieldList="superQueryFieldList" @handleSuperQuery="handleSuperQuery"/>
+    </div>
+
+    <!-- table区域-begin -->
+    <div>
+      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
+        <i class="anticon anticon-info-circle ant-alert-icon"></i>已选择&nbsp;<a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项&nbsp;&nbsp;
+        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
+      </div>
+
+      <a-table
+        ref="table"
+        bordered
+        size="middle"
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        @change="handleTableChange">
+
+        <template slot="avatarslot" slot-scope="text, record, index">
+          <div class="anty-img-wrap">
+            <a-avatar shape="square" :src="getAvatarView(record.avatar)" icon="user"/>
+          </div>
+        </template>
+
+        <span slot="action" slot-scope="text, record">
+          <a @click="handleEdit(record)" >编辑</a>
+
+          <a-divider type="vertical" />
+
+          <a-dropdown>
+            <a class="ant-dropdown-link">
+              更多 <a-icon type="down"/>
+            </a>
+            <a-menu slot="overlay">
+              <a-menu-item>
+                <a href="javascript:;" @click="handleDetail(record)">详情</a>
+              </a-menu-item>
+
+              <a-menu-item>
+                <a href="javascript:;" @click="handleChangePassword(record.username)">密码</a>
+              </a-menu-item>
+
+              <a-menu-item>
+                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
+                  <a>删除</a>
+                </a-popconfirm>
+              </a-menu-item>
+
+              <a-menu-item v-if="record.status==1">
+                <a-popconfirm title="确定冻结吗?" @confirm="() => handleFrozen(record.id,2,record.username)">
+                  <a>冻结</a>
+                </a-popconfirm>
+              </a-menu-item>
+
+              <a-menu-item v-if="record.status==2">
+                <a-popconfirm title="确定解冻吗?" @confirm="() => handleFrozen(record.id,1,record.username)">
+                  <a>解冻</a>
+                </a-popconfirm>
+              </a-menu-item>
+
+            </a-menu>
+          </a-dropdown>
+        </span>
+
+
+      </a-table>
+    </div>
+    <!-- table区域-end -->
+
+    <user-modal ref="modalForm" @ok="modalFormOk"></user-modal>
+
+    <password-modal ref="passwordmodal" @ok="passwordModalOk"></password-modal>
+
+    <sys-user-agent-modal ref="sysUserAgentModal"></sys-user-agent-modal>
+
+    <!-- 用户回收站 -->
+    <user-recycle-bin-modal :visible.sync="recycleBinVisible" @ok="modalFormOk"/>
+
+  </a-card>
+</template>
+
+<script>
+  import UserModal from './modules/UserModal'
+  import PasswordModal from './modules/PasswordModal'
+  import {putAction,getFileAccessHttpUrl} from '@/api/manage';
+  import {frozenBatch} from '@/api/api'
+  import {JeecgListMixin} from '@/mixins/JeecgListMixin'
+  import SysUserAgentModal from "./modules/SysUserAgentModal";
+  import JInput from '@/components/jeecg/JInput'
+  import UserRecycleBinModal from './modules/UserRecycleBinModal'
+  import JSuperQuery from '@/components/jeecg/JSuperQuery'
+  import JThirdAppButton from '@/components/jeecgbiz/thirdApp/JThirdAppButton'
+
+  export default {
+    name: "UserList",
+    mixins: [JeecgListMixin],
+    components: {
+      JThirdAppButton,
+      SysUserAgentModal,
+      UserModal,
+      PasswordModal,
+      JInput,
+      UserRecycleBinModal,
+      JSuperQuery
+    },
+    data() {
+      return {
+        description: '这是用户管理页面',
+        queryParam: {},
+        recycleBinVisible: false,
+        columns: [
+          /*{
+            title: '#',
+            dataIndex: '',
+            key:'rowIndex',
+            width:60,
+            align:"center",
+            customRender:function (t,r,index) {
+              return parseInt(index)+1;
+            }
+          },*/
+          {
+            title: '用户账号',
+            align: "center",
+            dataIndex: 'username',
+            width: 120,
+            sorter: true
+          },
+          {
+            title: '用户姓名',
+            align: "center",
+            width: 100,
+            dataIndex: 'realname',
+          },
+          {
+            title: '头像',
+            align: "center",
+            width: 120,
+            dataIndex: 'avatar',
+            scopedSlots: {customRender: "avatarslot"}
+          },
+
+          // {
+          //   title: '性别',
+          //   align: "center",
+          //   width: 80,
+          //   dataIndex: 'sex_dictText',
+          //   sorter: true
+          // },
+          // {
+          //   title: '生日',
+          //   align: "center",
+          //   width: 100,
+          //   dataIndex: 'birthday'
+          // },
+          // {
+          //   title: '手机号码',
+          //   align: "center",
+          //   width: 100,
+          //   dataIndex: 'phone'
+          // },
+          {
+            title: '部门',
+            align: "center",
+            width: 180,
+            dataIndex: 'orgCodeTxt'
+          },
+          // {
+          //   title: '负责部门',
+          //   align: "center",
+          //   width: 180,
+          //   dataIndex: 'departIds_dictText'
+          // },
+          {
+            title: '状态',
+            align: "center",
+            width: 80,
+            dataIndex: 'status_dictText'
+          },
+          {
+            title: '操作',
+            dataIndex: 'action',
+            scopedSlots: {customRender: 'action'},
+            align: "center",
+            width: 170
+          }
+
+        ],
+        superQueryFieldList: [
+          { type: 'input', value: 'username', text: '用户账号', },
+          { type: 'input', value: 'realname', text: '用户姓名', },
+          { type: 'select', value: 'sex', dbType: 'int', text: '性别', dictCode: 'sex' },
+        ],
+        url: {
+          syncUser: "/act/process/extActProcess/doSyncUser",
+          list: "/sys/user/list",
+          delete: "/sys/user/delete",
+          deleteBatch: "/sys/user/deleteBatch",
+          exportXlsUrl: "/sys/user/exportXls",
+          importExcelUrl: "sys/user/importExcel",
+        },
+      }
+    },
+    computed: {
+      importExcelUrl: function(){
+        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
+      }
+    },
+    methods: {
+      getAvatarView: function (avatar) {
+        return getFileAccessHttpUrl(avatar)
+      },
+
+      batchFrozen: function (status) {
+        if (this.selectedRowKeys.length <= 0) {
+          this.$message.warning('请选择一条记录!');
+          return false;
+        } else {
+          let ids = "";
+          let that = this;
+          let isAdmin = false;
+          that.selectionRows.forEach(function (row) {
+            if (row.username == 'admin') {
+              isAdmin = true;
+            }
+          });
+          if (isAdmin) {
+            that.$message.warning('管理员账号不允许此操作,请重新选择!');
+            return;
+          }
+          that.selectedRowKeys.forEach(function (val) {
+            ids += val + ",";
+          });
+          that.$confirm({
+            title: "确认操作",
+            content: "是否" + (status == 1 ? "解冻" : "冻结") + "选中账号?",
+            onOk: function () {
+              frozenBatch({ids: ids, status: status}).then((res) => {
+                if (res.success) {
+                  that.$message.success(res.message);
+                  that.loadData();
+                  that.onClearSelected();
+                } else {
+                  that.$message.warning(res.message);
+                }
+              });
+            }
+          });
+        }
+      },
+      handleMenuClick(e) {
+        if (e.key == 1) {
+          this.batchDel();
+        } else if (e.key == 2) {
+          this.batchFrozen(2);
+        } else if (e.key == 3) {
+          this.batchFrozen(1);
+        }
+      },
+      handleFrozen: function (id, status, username) {
+        let that = this;
+        //TODO 后台校验管理员角色
+        if ('admin' == username) {
+          that.$message.warning('管理员账号不允许此操作!');
+          return;
+        }
+        frozenBatch({ids: id, status: status}).then((res) => {
+          if (res.success) {
+            that.$message.success(res.message);
+            that.loadData();
+          } else {
+            that.$message.warning(res.message);
+          }
+        });
+      },
+      handleChangePassword(username) {
+        this.$refs.passwordmodal.show(username);
+      },
+      passwordModalOk() {
+        //TODO 密码修改完成 不需要刷新页面,可以把datasource中的数据更新一下
+      },
+      onSyncFinally({isToLocal}) {
+        // 同步到本地时刷新下数据
+        if (isToLocal) {
+          this.loadData()
+        }
+      },
+    }
+
+  }
+</script>
+<style scoped>
+  @import '~@assets/less/common.less'
 </style>

+ 525 - 525
src/views/system/modules/UserModal.vue

@@ -1,525 +1,525 @@
-<template>
-  <a-drawer
-          :title="title"
-          :maskClosable="true"
-          :width="drawerWidth"
-          placement="right"
-          :closable="true"
-          @close="handleCancel"
-          :visible="visible"
-          style="height: 100%;">
-
-    <template slot="title">
-      <div style="width: 100%;">
-        <span>{{ title }}</span>
-        <span style="display:inline-block;width:calc(100% - 51px);padding-right:10px;text-align: right">
-          <a-button @click="toggleScreen" icon="appstore" style="height:20px;width:20px;border:0px"></a-button>
-        </span>
-      </div>
-
-    </template>
-
-    <a-spin :spinning="confirmLoading">
-      <a-form-model ref="form" :model="model" :rules="validatorRules">
-
-        <a-form-model-item label="用户账号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="username">
-          <a-input placeholder="请输入用户账号" v-model="model.username" :readOnly="!!model.id"/>
-        </a-form-model-item>
-
-        <template v-if="!model.id">
-          <a-form-model-item label="登录密码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="password" >
-            <a-input type="password" placeholder="请输入登录密码" v-model="model.password" />
-          </a-form-model-item>
-
-          <a-form-model-item label="确认密码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="confirmpassword" >
-            <a-input type="password" @blur="handleConfirmBlur" placeholder="请重新输入登录密码" v-model="model.confirmpassword"/>
-          </a-form-model-item>
-        </template>
-
-        <a-form-model-item label="用户姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="realname">
-          <a-input placeholder="请输入用户姓名" v-model="model.realname" />
-        </a-form-model-item>
-
-        <a-form-model-item label="工号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workNo">
-          <a-input placeholder="请输入工号" v-model="model.workNo" />
-        </a-form-model-item>
-
-        <a-form-model-item label="手机号码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="phone">
-          <a-input placeholder="请输入手机号码" v-model="model.phone" />
-        </a-form-model-item>
-
-        <a-form-model-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <j-select-position placeholder="请选择职务" :multiple="false" v-model="model.post"/>
-        </a-form-model-item>
-
-        <a-form-model-item label="角色分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!roleDisabled" >
-          <j-multi-select-tag
-                  :disabled="disableSubmit"
-                  v-model="model.selectedroles"
-                  :options="rolesOptions"
-                  placeholder="请选择角色">
-          </j-multi-select-tag>
-        </a-form-model-item>
-
-        <!--部门分配-->
-        <a-form-model-item label="部门分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
-          <j-select-depart v-model="model.selecteddeparts" :multi="true" @back="backDepartInfo" :backDepart="true" :treeOpera="true">></j-select-depart>
-        </a-form-model-item>
-
-        <!--租户分配-->
-        <a-form-model-item label="租户分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
-          <j-multi-select-tag
-                  :disabled="disableSubmit"
-                  v-model="model.relTenantIds"
-                  :options="tenantsOptions"
-                  placeholder="请选择租户">
-          </j-multi-select-tag>
-        </a-form-model-item>
-
-        <a-form-model-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-radio-group  v-model="model.userIdentity"  @change="identityChange">
-            <a-radio :value="1">普通用户</a-radio>
-            <a-radio :value="2">上级</a-radio>
-          </a-radio-group>
-        </a-form-model-item>
-        <a-form-model-item label="负责部门" :labelCol="labelCol" :wrapperCol="wrapperCol"  v-show="departIdShow==true">
-          <j-multi-select-tag
-                  :disabled="disableSubmit"
-                  v-model="model.departIds"
-                  :options="nextDepartOptions"
-                  placeholder="请选择负责部门">
-          </j-multi-select-tag>
-        </a-form-model-item>
-
-        <a-form-model-item label="头像" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <j-image-upload class="avatar-uploader" text="上传" v-model="model.avatar" ></j-image-upload>
-        </a-form-model-item>
-
-        <a-form-model-item label="生日" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-date-picker
-                  style="width: 100%"
-                  placeholder="请选择生日"
-                  v-model="model.birthday"
-                  :format="dateFormat"
-                  :getCalendarContainer="node => node.parentNode"/>
-        </a-form-model-item>
-
-        <a-form-model-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <a-select  v-model="model.sex"  placeholder="请选择性别" :getPopupContainer= "(target) => target.parentNode">
-            <a-select-option :value="1">男</a-select-option>
-            <a-select-option :value="2">女</a-select-option>
-          </a-select>
-        </a-form-model-item>
-
-        <a-form-model-item label="邮箱" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="email">
-          <a-input placeholder="请输入邮箱" v-model="model.email" />
-        </a-form-model-item>
-
-        <a-form-model-item label="座机" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="telephone">
-          <a-input placeholder="请输入座机" v-model="model.telephone" />
-        </a-form-model-item>
-
-        <a-form-model-item label="工作流引擎" :labelCol="labelCol" :wrapperCol="wrapperCol">
-          <j-dict-select-tag  v-model="model.activitiSync"  placeholder="请选择是否同步工作流引擎" :type="'radio'" dictCode="activiti_sync"/>
-        </a-form-model-item>
-
-      </a-form-model>
-    </a-spin>
-
-
-    <div class="drawer-bootom-button" v-show="!disableSubmit">
-      <a-popconfirm title="确定放弃编辑?" @confirm="handleCancel" okText="确定" cancelText="取消">
-        <a-button style="margin-right: .8rem">取消</a-button>
-      </a-popconfirm>
-      <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">提交</a-button>
-    </div>
-  </a-drawer>
-</template>
-
-<script>
-  import moment from 'moment'
-  import Vue from 'vue'
-  import { ACCESS_TOKEN } from "@/store/mutation-types"
-  import { getAction } from '@/api/manage'
-  import { addUser,editUser,queryUserRole,queryall } from '@/api/api'
-  import { disabledAuthFilter } from "@/utils/authFilter"
-  import { duplicateCheck } from '@/api/api'
-
-  export default {
-    name: "UserModal",
-    components: {
-    },
-    data () {
-      return {
-        departDisabled: false, //是否是我的部门调用该页面
-        roleDisabled: false, //是否是角色维护调用该页面
-        modalWidth:800,
-        drawerWidth:700,
-        modaltoggleFlag:true,
-        confirmDirty: false,
-        userId:"", //保存用户id
-        disableSubmit:false,
-        dateFormat:"YYYY-MM-DD",
-        validatorRules:{
-          username:[{required: true, message: '请输入用户账号!'},
-            {validator: this.validateUsername,}],
-          password: [{required: true,pattern:/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/,message: '密码由8位数字、大小写字母和特殊符号组成!'},
-            {validator: this.validateToNextPassword,trigger: 'change'}],
-          confirmpassword: [{required: true, message: '请重新输入登录密码!',},
-            { validator: this.compareToFirstPassword,}],
-          realname:[{ required: true, message: '请输入用户名称!' }],
-          phone: [{required: true, message: '请输入手机号!'}, {validator: this.validatePhone}],
-          email: [{validator: this.validateEmail}],
-          roles:{},
-          workNo:[ { required: true, message: '请输入工号' },
-            { validator: this.validateWorkNo }],
-          telephone: [{ pattern: /^0\d{2,3}-[1-9]\d{6,7}$/, message: '请输入正确的座机号码' },]
-        },
-        departIdShow:false,
-        title:"操作",
-        visible: false,
-        model: {},
-        labelCol: {
-          xs: { span: 24 },
-          sm: { span: 5 },
-        },
-        wrapperCol: {
-          xs: { span: 24 },
-          sm: { span: 16 },
-        },
-        uploadLoading:false,
-        confirmLoading: false,
-        headers:{},
-        url: {
-          fileUpload: window._CONFIG['domianURL']+"/sys/common/upload",
-          userWithDepart: "/sys/user/userDepartList", // 引入为指定用户查看部门信息需要的url
-          userId:"/sys/user/generateUserId", // 引入生成添加用户情况下的url
-          syncUserByUserName:"/act/process/extActProcess/doSyncUserByUserName",//同步用户到工作流
-          queryTenantList: '/sys/tenant/queryList'
-        },
-        tenantsOptions: [],
-        rolesOptions:[],
-        nextDepartOptions:[],
-      }
-    },
-    created () {
-      const token = Vue.ls.get(ACCESS_TOKEN);
-      this.headers = {"X-Access-Token":token}
-      this.initRoleList()
-      this.initTenantList()
-    },
-    computed:{
-      uploadAction:function () {
-        return this.url.fileUpload;
-      }
-    },
-    methods: {
-      add () {
-        this.refresh();
-        this.edit({activitiSync:'1',userIdentity:1});
-      },
-      edit (record) {
-        let that = this;
-        that.visible = true;
-        //根据屏幕宽度自适应抽屉宽度
-        this.resetScreenSize();
-        that.userId = record.id;
-        that.model = Object.assign({},{selectedroles:'',selecteddeparts:''}, record);
-        //身份为上级显示负责部门,否则不显示
-        if(this.model.userIdentity==2){
-          this.departIdShow=true;
-        }else{
-          this.departIdShow=false;
-        }
-
-        if(record.hasOwnProperty("id")){
-          that.getUserRoles(record.id);
-          that.getUserDeparts(record.id);
-        }
-        console.log('that.model=',that.model)
-      },
-      isDisabledAuth(code){
-        return disabledAuthFilter(code);
-      },
-      //窗口最大化切换
-      toggleScreen(){
-        if(this.modaltoggleFlag){
-          this.modalWidth = window.innerWidth;
-        }else{
-          this.modalWidth = 800;
-        }
-        this.modaltoggleFlag = !this.modaltoggleFlag;
-      },
-      // 根据屏幕变化,设置抽屉尺寸
-      resetScreenSize(){
-        let screenWidth = document.body.clientWidth;
-        if(screenWidth < 500){
-          this.drawerWidth = screenWidth;
-        }else{
-          this.drawerWidth = 700;
-        }
-      },
-      //初始化租户字典
-      initTenantList(){
-        getAction(this.url.queryTenantList).then(res=>{
-          if(res.success){
-            this.tenantsOptions = res.result.map((item,index,arr)=>{
-              let c = {label:item.name, value: item.id+""}
-              return c;
-            })
-            console.log('this.tenantsOptions: ',this.tenantsOptions)
-          }
-        })
-      },
-      //初始化角色字典
-      initRoleList(){
-        queryall().then((res)=>{
-          if(res.success){
-            this.rolesOptions = res.result.map((item,index,arr)=>{
-              let c = {label:item.roleName, value:item.id}
-              return c;
-            })
-            console.log('this.rolesOptions: ',this.rolesOptions)
-          }
-        });
-      },
-      getUserRoles(userid){
-        queryUserRole({userid:userid}).then((res)=>{
-          if(res.success){
-            this.model.selectedroles = res.result.join(",");
-            console.log('that.model.selectedroles=',this.model.selectedroles)
-          }
-        });
-      },
-      getUserDeparts(userid){
-        let that = this;
-        getAction(that.url.userWithDepart,{userId:userid}).then((res)=>{
-          if(res.success){
-            let departOptions=[];
-            let selectDepartKeys=[]
-            for (let i = 0; i < res.result.length; i++) {
-              selectDepartKeys.push(res.result[i].key);
-              //新增负责部门选择下拉框
-              departOptions.push({
-                value: res.result[i].key,
-                label: res.result[i].title
-              })
-            }
-            that.model.selecteddeparts = selectDepartKeys.join(",")
-            that.nextDepartOptions=departOptions;
-            console.log('that.nextDepartOptions=',that.nextDepartOptions)
-          }
-        })
-      },
-      backDepartInfo(info) {
-        this.model.departIds = this.model.selecteddeparts;
-        this.nextDepartOptions = info.map((item,index,arr)=>{
-          let c = {label:item.text, value: item.value+""}
-          return c;
-        })
-      },
-      refresh () {
-        this.userId=""
-        this.nextDepartOptions=[];
-        this.departIdShow=false;
-      },
-      close () {
-        this.$emit('close');
-        this.visible = false;
-        this.disableSubmit = false;
-        this.nextDepartOptions=[];
-        this.departIdShow=false;
-        this.$refs.form.resetFields();
-      },
-      moment,
-      handleSubmit () {
-        const that = this;
-        // 触发表单验证
-        this.$refs.form.validate(valid => {
-          if (valid) {
-            that.confirmLoading = true;
-            //如果是上级择传入departIds,否则为空
-            if(this.model.userIdentity!==2){
-              this.model.departIds="";
-            }
-            let obj;
-            if(!this.model.id){
-              this.model.id = this.userId;
-              obj=addUser(this.model);
-            }else{
-              obj=editUser(this.model);
-            }
-            obj.then((res)=>{
-              if(res.success){
-                that.$message.success(res.message);
-                that.$emit('ok');
-              }else{
-                that.$message.warning(res.message);
-              }
-            }).finally(() => {
-              that.confirmLoading = false;
-              that.close();
-            })
-          }else{
-            return false;
-          }
-        })
-      },
-      handleCancel () {
-        this.close()
-      },
-      validateToNextPassword (rule, value, callback) {
-        const confirmpassword=this.model.confirmpassword;
-        if (value && confirmpassword && value !== confirmpassword) {
-          callback('两次输入的密码不一样!');
-        }
-        if (value && this.confirmDirty) {
-          this.$refs.form.validateField(['confirmpassword']);
-        }
-        callback();
-      },
-      compareToFirstPassword (rule, value, callback) {
-        if (value && value !== this.model.password) {
-          callback('两次输入的密码不一样!');
-        } else {
-          callback()
-        }
-      },
-      validatePhone(rule, value, callback){
-        if(!value){
-          callback()
-        }else{
-          if(new RegExp(/^1[3|4|5|6|7|8|9][0-9]\d{8}$/).test(value)){
-            var params = {
-              tableName: 'sys_user',
-              fieldName: 'phone',
-              fieldVal: value,
-              dataId: this.userId
-            };
-            duplicateCheck(params).then((res) => {
-              if (res.success) {
-                callback()
-              } else {
-                callback("手机号已存在!")
-              }
-            })
-          }else{
-            callback("请输入正确格式的手机号码!");
-          }
-        }
-      },
-      validateEmail(rule, value, callback){
-        if(!value){
-          callback()
-        }else{
-          if(new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/).test(value)){
-            var params = {
-              tableName: 'sys_user',
-              fieldName: 'email',
-              fieldVal: value,
-              dataId: this.userId
-            };
-            duplicateCheck(params).then((res) => {
-              console.log(res)
-              if (res.success) {
-                callback()
-              } else {
-                callback("邮箱已存在!")
-              }
-            })
-          }else{
-            callback("请输入正确格式的邮箱!")
-          }
-        }
-      },
-      validateUsername(rule, value, callback){
-        var params = {
-          tableName: 'sys_user',
-          fieldName: 'username',
-          fieldVal: value,
-          dataId: this.userId
-        };
-        duplicateCheck(params).then((res) => {
-          if (res.success) {
-            callback()
-          } else {
-            callback("用户名已存在!")
-          }
-        })
-      },
-      validateWorkNo(rule, value, callback){
-        var params = {
-          tableName: 'sys_user',
-          fieldName: 'work_no',
-          fieldVal: value,
-          dataId: this.userId
-        };
-        duplicateCheck(params).then((res) => {
-          if (res.success) {
-            callback()
-          } else {
-            callback("工号已存在!")
-          }
-        })
-      },
-      handleConfirmBlur(e) {
-        const value = e.target.value;
-        this.confirmDirty = this.confirmDirty || !!value
-      },
-      beforeUpload: function(file){
-        var fileType = file.type;
-        if(fileType.indexOf('image')<0){
-          this.$message.warning('请上传图片');
-          return false;
-        }
-        //TODO 验证文件大小
-      },
-      identityChange(e){
-        if(e.target.value===1){
-          this.departIdShow=false;
-        }else{
-          this.departIdShow=true;
-        }
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .avatar-uploader > .ant-upload {
-    width:104px;
-    height:104px;
-  }
-  .ant-upload-select-picture-card i {
-    font-size: 49px;
-    color: #999;
-  }
-
-  .ant-upload-select-picture-card .ant-upload-text {
-    margin-top: 8px;
-    color: #666;
-  }
-
-  .ant-table-tbody .ant-table-row td{
-    padding-top:10px;
-    padding-bottom:10px;
-  }
-
-  .drawer-bootom-button {
-    position: absolute;
-    bottom: 0;
-    width: 100%;
-    border-top: 1px solid #e8e8e8;
-    padding: 10px 16px;
-    text-align: right;
-    left: 0;
-    background: #fff;
-    border-radius: 0 0 2px 2px;
-  }
-
-  /*【JTC-502】 添加用户两个滚动条*/
-  /deep/ .ant-drawer-body {
-    padding-bottom: 53px;
-  }
-
-</style>
+<template>
+  <a-drawer
+          :title="title"
+          :maskClosable="true"
+          :width="drawerWidth"
+          placement="right"
+          :closable="true"
+          @close="handleCancel"
+          :visible="visible"
+          style="height: 100%;">
+
+    <template slot="title">
+      <div style="width: 100%;">
+        <span>{{ title }}</span>
+        <span style="display:inline-block;width:calc(100% - 51px);padding-right:10px;text-align: right">
+          <a-button @click="toggleScreen" icon="appstore" style="height:20px;width:20px;border:0px"></a-button>
+        </span>
+      </div>
+
+    </template>
+
+    <a-spin :spinning="confirmLoading">
+      <a-form-model ref="form" :model="model" :rules="validatorRules">
+
+        <a-form-model-item label="用户账号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="username">
+          <a-input placeholder="请输入用户账号" v-model="model.username" :readOnly="!!model.id"/>
+        </a-form-model-item>
+
+        <template v-if="!model.id">
+          <a-form-model-item label="登录密码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="password" >
+            <a-input type="password" placeholder="请输入登录密码" v-model="model.password" />
+          </a-form-model-item>
+
+          <a-form-model-item label="确认密码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="confirmpassword" >
+            <a-input type="password" @blur="handleConfirmBlur" placeholder="请重新输入登录密码" v-model="model.confirmpassword"/>
+          </a-form-model-item>
+        </template>
+
+        <a-form-model-item label="用户姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="realname">
+          <a-input placeholder="请输入用户姓名" v-model="model.realname" />
+        </a-form-model-item>
+
+        <!-- <a-form-model-item label="工号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workNo">
+          <a-input placeholder="请输入工号" v-model="model.workNo" />
+        </a-form-model-item> -->
+
+        <!-- <a-form-model-item label="手机号码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="phone">
+          <a-input placeholder="请输入手机号码" v-model="model.phone" />
+        </a-form-model-item> -->
+
+        <!-- <a-form-model-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <j-select-position placeholder="请选择职务" :multiple="false" v-model="model.post"/>
+        </a-form-model-item> -->
+
+        <a-form-model-item label="角色分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!roleDisabled" >
+          <j-multi-select-tag
+                  :disabled="disableSubmit"
+                  v-model="model.selectedroles"
+                  :options="rolesOptions"
+                  placeholder="请选择角色">
+          </j-multi-select-tag>
+        </a-form-model-item>
+
+        <!--部门分配-->
+        <a-form-model-item label="部门分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
+          <j-select-depart v-model="model.selecteddeparts" :multi="true" @back="backDepartInfo" :backDepart="true" :treeOpera="true">></j-select-depart>
+        </a-form-model-item>
+
+        <a-form-model-item label="头像" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <j-image-upload class="avatar-uploader" text="上传" v-model="model.avatar" ></j-image-upload>
+        </a-form-model-item>
+
+        <!--租户分配-->
+        <!-- <a-form-model-item label="租户分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
+          <j-multi-select-tag
+                  :disabled="disableSubmit"
+                  v-model="model.relTenantIds"
+                  :options="tenantsOptions"
+                  placeholder="请选择租户">
+          </j-multi-select-tag>
+        </a-form-model-item> -->
+
+        <!-- <a-form-model-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-radio-group  v-model="model.userIdentity"  @change="identityChange">
+            <a-radio :value="1">普通用户</a-radio>
+            <a-radio :value="2">上级</a-radio>
+          </a-radio-group>
+        </a-form-model-item>
+        <a-form-model-item label="负责部门" :labelCol="labelCol" :wrapperCol="wrapperCol"  v-show="departIdShow==true">
+          <j-multi-select-tag
+                  :disabled="disableSubmit"
+                  v-model="model.departIds"
+                  :options="nextDepartOptions"
+                  placeholder="请选择负责部门">
+          </j-multi-select-tag>
+        </a-form-model-item>
+
+        <a-form-model-item label="生日" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-date-picker
+                  style="width: 100%"
+                  placeholder="请选择生日"
+                  v-model="model.birthday"
+                  :format="dateFormat"
+                  :getCalendarContainer="node => node.parentNode"/>
+        </a-form-model-item>
+
+        <a-form-model-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-select  v-model="model.sex"  placeholder="请选择性别" :getPopupContainer= "(target) => target.parentNode">
+            <a-select-option :value="1">男</a-select-option>
+            <a-select-option :value="2">女</a-select-option>
+          </a-select>
+        </a-form-model-item>
+
+        <a-form-model-item label="邮箱" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="email">
+          <a-input placeholder="请输入邮箱" v-model="model.email" />
+        </a-form-model-item>
+
+        <a-form-model-item label="座机" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="telephone">
+          <a-input placeholder="请输入座机" v-model="model.telephone" />
+        </a-form-model-item>
+
+        <a-form-model-item label="工作流引擎" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <j-dict-select-tag  v-model="model.activitiSync"  placeholder="请选择是否同步工作流引擎" :type="'radio'" dictCode="activiti_sync"/>
+        </a-form-model-item> -->
+
+      </a-form-model>
+    </a-spin>
+
+
+    <div class="drawer-bootom-button" v-show="!disableSubmit">
+      <a-popconfirm title="确定放弃编辑?" @confirm="handleCancel" okText="确定" cancelText="取消">
+        <a-button style="margin-right: .8rem">取消</a-button>
+      </a-popconfirm>
+      <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">提交</a-button>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+  import moment from 'moment'
+  import Vue from 'vue'
+  import { ACCESS_TOKEN } from "@/store/mutation-types"
+  import { getAction } from '@/api/manage'
+  import { addUser,editUser,queryUserRole,queryall } from '@/api/api'
+  import { disabledAuthFilter } from "@/utils/authFilter"
+  import { duplicateCheck } from '@/api/api'
+
+  export default {
+    name: "UserModal",
+    components: {
+    },
+    data () {
+      return {
+        departDisabled: false, //是否是我的部门调用该页面
+        roleDisabled: false, //是否是角色维护调用该页面
+        modalWidth:800,
+        drawerWidth:700,
+        modaltoggleFlag:true,
+        confirmDirty: false,
+        userId:"", //保存用户id
+        disableSubmit:false,
+        dateFormat:"YYYY-MM-DD",
+        validatorRules:{
+          username:[{required: true, message: '请输入用户账号!'},
+            {validator: this.validateUsername,}],
+          password: [{required: true,pattern:/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/,message: '密码由8位数字、大小写字母和特殊符号组成!'},
+            {validator: this.validateToNextPassword,trigger: 'change'}],
+          confirmpassword: [{required: true, message: '请重新输入登录密码!',},
+            { validator: this.compareToFirstPassword,}],
+          realname:[{ required: true, message: '请输入用户名称!' }],
+          // phone: [{required: true, message: '请输入手机号!'}, {validator: this.validatePhone}],
+          // email: [{validator: this.validateEmail}],
+          roles:{},
+          // workNo:[ { required: true, message: '请输入工号' },
+          //   { validator: this.validateWorkNo }],
+          // telephone: [{ pattern: /^0\d{2,3}-[1-9]\d{6,7}$/, message: '请输入正确的座机号码' },]
+        },
+        departIdShow:false,
+        title:"操作",
+        visible: false,
+        model: {},
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 5 },
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 16 },
+        },
+        uploadLoading:false,
+        confirmLoading: false,
+        headers:{},
+        url: {
+          fileUpload: window._CONFIG['domianURL']+"/sys/common/upload",
+          userWithDepart: "/sys/user/userDepartList", // 引入为指定用户查看部门信息需要的url
+          userId:"/sys/user/generateUserId", // 引入生成添加用户情况下的url
+          syncUserByUserName:"/act/process/extActProcess/doSyncUserByUserName",//同步用户到工作流
+          queryTenantList: '/sys/tenant/queryList'
+        },
+        tenantsOptions: [],
+        rolesOptions:[],
+        nextDepartOptions:[],
+      }
+    },
+    created () {
+      const token = Vue.ls.get(ACCESS_TOKEN);
+      this.headers = {"X-Access-Token":token}
+      this.initRoleList()
+      // this.initTenantList()
+    },
+    computed:{
+      uploadAction:function () {
+        return this.url.fileUpload;
+      }
+    },
+    methods: {
+      add () {
+        this.refresh();
+        this.edit({activitiSync:'1',userIdentity:1});
+      },
+      edit (record) {
+        let that = this;
+        that.visible = true;
+        //根据屏幕宽度自适应抽屉宽度
+        this.resetScreenSize();
+        that.userId = record.id;
+        that.model = Object.assign({},{selectedroles:'',selecteddeparts:''}, record);
+        //身份为上级显示负责部门,否则不显示
+        if(this.model.userIdentity==2){
+          this.departIdShow=true;
+        }else{
+          this.departIdShow=false;
+        }
+
+        if(record.hasOwnProperty("id")){
+          that.getUserRoles(record.id);
+          that.getUserDeparts(record.id);
+        }
+        console.log('that.model=',that.model)
+      },
+      isDisabledAuth(code){
+        return disabledAuthFilter(code);
+      },
+      //窗口最大化切换
+      toggleScreen(){
+        if(this.modaltoggleFlag){
+          this.modalWidth = window.innerWidth;
+        }else{
+          this.modalWidth = 800;
+        }
+        this.modaltoggleFlag = !this.modaltoggleFlag;
+      },
+      // 根据屏幕变化,设置抽屉尺寸
+      resetScreenSize(){
+        let screenWidth = document.body.clientWidth;
+        if(screenWidth < 500){
+          this.drawerWidth = screenWidth;
+        }else{
+          this.drawerWidth = 700;
+        }
+      },
+      //初始化租户字典
+      initTenantList(){
+        getAction(this.url.queryTenantList).then(res=>{
+          if(res.success){
+            this.tenantsOptions = res.result.map((item,index,arr)=>{
+              let c = {label:item.name, value: item.id+""}
+              return c;
+            })
+            console.log('this.tenantsOptions: ',this.tenantsOptions)
+          }
+        })
+      },
+      //初始化角色字典
+      initRoleList(){
+        queryall().then((res)=>{
+          if(res.success){
+            this.rolesOptions = res.result.map((item,index,arr)=>{
+              let c = {label:item.roleName, value:item.id}
+              return c;
+            })
+            console.log('this.rolesOptions: ',this.rolesOptions)
+          }
+        });
+      },
+      getUserRoles(userid){
+        queryUserRole({userid:userid}).then((res)=>{
+          if(res.success){
+            this.model.selectedroles = res.result.join(",");
+            console.log('that.model.selectedroles=',this.model.selectedroles)
+          }
+        });
+      },
+      getUserDeparts(userid){
+        let that = this;
+        getAction(that.url.userWithDepart,{userId:userid}).then((res)=>{
+          if(res.success){
+            let departOptions=[];
+            let selectDepartKeys=[]
+            for (let i = 0; i < res.result.length; i++) {
+              selectDepartKeys.push(res.result[i].key);
+              //新增负责部门选择下拉框
+              departOptions.push({
+                value: res.result[i].key,
+                label: res.result[i].title
+              })
+            }
+            that.model.selecteddeparts = selectDepartKeys.join(",")
+            that.nextDepartOptions=departOptions;
+            console.log('that.nextDepartOptions=',that.nextDepartOptions)
+          }
+        })
+      },
+      backDepartInfo(info) {
+        this.model.departIds = this.model.selecteddeparts;
+        this.nextDepartOptions = info.map((item,index,arr)=>{
+          let c = {label:item.text, value: item.value+""}
+          return c;
+        })
+      },
+      refresh () {
+        this.userId=""
+        this.nextDepartOptions=[];
+        this.departIdShow=false;
+      },
+      close () {
+        this.$emit('close');
+        this.visible = false;
+        this.disableSubmit = false;
+        this.nextDepartOptions=[];
+        this.departIdShow=false;
+        this.$refs.form.resetFields();
+      },
+      moment,
+      handleSubmit () {
+        const that = this;
+        // 触发表单验证
+        this.$refs.form.validate(valid => {
+          if (valid) {
+            that.confirmLoading = true;
+            //如果是上级择传入departIds,否则为空
+            if(this.model.userIdentity!==2){
+              this.model.departIds="";
+            }
+            let obj;
+            if(!this.model.id){
+              this.model.id = this.userId;
+              obj=addUser(this.model);
+            }else{
+              obj=editUser(this.model);
+            }
+            obj.then((res)=>{
+              if(res.success){
+                that.$message.success(res.message);
+                that.$emit('ok');
+              }else{
+                that.$message.warning(res.message);
+              }
+            }).finally(() => {
+              that.confirmLoading = false;
+              that.close();
+            })
+          }else{
+            return false;
+          }
+        })
+      },
+      handleCancel () {
+        this.close()
+      },
+      validateToNextPassword (rule, value, callback) {
+        const confirmpassword=this.model.confirmpassword;
+        if (value && confirmpassword && value !== confirmpassword) {
+          callback('两次输入的密码不一样!');
+        }
+        if (value && this.confirmDirty) {
+          this.$refs.form.validateField(['confirmpassword']);
+        }
+        callback();
+      },
+      compareToFirstPassword (rule, value, callback) {
+        if (value && value !== this.model.password) {
+          callback('两次输入的密码不一样!');
+        } else {
+          callback()
+        }
+      },
+      validatePhone(rule, value, callback){
+        if(!value){
+          callback()
+        }else{
+          if(new RegExp(/^1[3|4|5|6|7|8|9][0-9]\d{8}$/).test(value)){
+            var params = {
+              tableName: 'sys_user',
+              fieldName: 'phone',
+              fieldVal: value,
+              dataId: this.userId
+            };
+            duplicateCheck(params).then((res) => {
+              if (res.success) {
+                callback()
+              } else {
+                callback("手机号已存在!")
+              }
+            })
+          }else{
+            callback("请输入正确格式的手机号码!");
+          }
+        }
+      },
+      validateEmail(rule, value, callback){
+        if(!value){
+          callback()
+        }else{
+          if(new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/).test(value)){
+            var params = {
+              tableName: 'sys_user',
+              fieldName: 'email',
+              fieldVal: value,
+              dataId: this.userId
+            };
+            duplicateCheck(params).then((res) => {
+              console.log(res)
+              if (res.success) {
+                callback()
+              } else {
+                callback("邮箱已存在!")
+              }
+            })
+          }else{
+            callback("请输入正确格式的邮箱!")
+          }
+        }
+      },
+      validateUsername(rule, value, callback){
+        var params = {
+          tableName: 'sys_user',
+          fieldName: 'username',
+          fieldVal: value,
+          dataId: this.userId
+        };
+        duplicateCheck(params).then((res) => {
+          if (res.success) {
+            callback()
+          } else {
+            callback("用户名已存在!")
+          }
+        })
+      },
+      validateWorkNo(rule, value, callback){
+        var params = {
+          tableName: 'sys_user',
+          fieldName: 'work_no',
+          fieldVal: value,
+          dataId: this.userId
+        };
+        duplicateCheck(params).then((res) => {
+          if (res.success) {
+            callback()
+          } else {
+            callback("工号已存在!")
+          }
+        })
+      },
+      handleConfirmBlur(e) {
+        const value = e.target.value;
+        this.confirmDirty = this.confirmDirty || !!value
+      },
+      beforeUpload: function(file){
+        var fileType = file.type;
+        if(fileType.indexOf('image')<0){
+          this.$message.warning('请上传图片');
+          return false;
+        }
+        //TODO 验证文件大小
+      },
+      identityChange(e){
+        if(e.target.value===1){
+          this.departIdShow=false;
+        }else{
+          this.departIdShow=true;
+        }
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .avatar-uploader > .ant-upload {
+    width:104px;
+    height:104px;
+  }
+  .ant-upload-select-picture-card i {
+    font-size: 49px;
+    color: #999;
+  }
+
+  .ant-upload-select-picture-card .ant-upload-text {
+    margin-top: 8px;
+    color: #666;
+  }
+
+  .ant-table-tbody .ant-table-row td{
+    padding-top:10px;
+    padding-bottom:10px;
+  }
+
+  .drawer-bootom-button {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: right;
+    left: 0;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+  }
+
+  /*【JTC-502】 添加用户两个滚动条*/
+  /deep/ .ant-drawer-body {
+    padding-bottom: 53px;
+  }
+
+</style>

+ 159 - 159
src/views/user/LoginAccount.vue

@@ -1,160 +1,160 @@
-<template>
-    <div>
-      <a-form-model ref="form" :model="model" :rules="validatorRules">
-        <a-form-model-item required prop="username">
-          <a-input v-model="model.username" size="large" placeholder="请输入帐户名 / admin">
-            <a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-          </a-input>
-        </a-form-model-item>
-        <a-form-model-item required prop="password">
-          <a-input v-model="model.password" size="large" type="password" autocomplete="false" placeholder="请输入密码 / 123456">
-            <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-          </a-input>
-        </a-form-model-item>
-
-        <a-row :gutter="0">
-          <a-col :span="16">
-            <a-form-model-item required prop="inputCode">
-              <a-input v-model="model.inputCode" size="large" type="text" placeholder="请输入验证码">
-                <a-icon slot="prefix" type="smile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-              </a-input>
-            </a-form-model-item>
-          </a-col>
-          <a-col :span="8" style="text-align: right">
-            <img v-if="requestCodeSuccess" style="margin-top: 2px;" :src="randCodeImage" @click="handleChangeCheckCode"/>
-            <img v-else style="margin-top: 2px;" src="../../assets/checkcode.png" @click="handleChangeCheckCode"/>
-          </a-col>
-        </a-row>
-      </a-form-model>
-    </div>
-</template>
-
-<script>
-  import { getAction } from '@/api/manage'
-  import Vue from 'vue'
-  import { mapActions } from 'vuex'
-
-  export default {
-    name: 'LoginAccount',
-    data(){
-      return {
-        requestCodeSuccess: false,
-        randCodeImage: '',
-        currdatetime: '',
-        loginType: 0,
-        model:{
-          username: 'admin',
-          password: '123456',
-          inputCode: ''
-        },
-        validatorRules:{
-          username: [
-            { required: true, message: '请输入用户名!' },
-            { validator: this.handleUsernameOrEmail }
-          ],
-          password: [{
-            required: true, message: '请输入密码!', validator: 'click'
-          }],
-          inputCode: [{
-            required: true, message: '请输入验证码!'
-          }]
-        }
-
-      }
-    },
-    created() {
-      this.handleChangeCheckCode();
-    },
-    methods:{
-      ...mapActions(['Login']),
-      /**刷新验证码*/
-      handleChangeCheckCode(){
-        this.currdatetime = new Date().getTime();
-        this.model.inputCode = ''
-        getAction(`/sys/randomImage/${this.currdatetime}`).then(res=>{
-          if(res.success){
-            this.randCodeImage = res.result
-            this.requestCodeSuccess=true
-          }else{
-            this.$message.error(res.message)
-            this.requestCodeSuccess=false
-          }
-        }).catch(()=>{
-          this.requestCodeSuccess=false
-        })
-      },
-      // 判断登录类型
-      handleUsernameOrEmail (rule, value, callback) {
-        const regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
-        if (regex.test(value)) {
-          this.loginType = 0
-        } else {
-          this.loginType = 1
-        }
-        callback()
-      },
-      /**
-       * 验证字段
-       * @param arr
-       * @param callback
-       */
-      validateFields(arr, callback){
-        let promiseArray = []
-        for(let item of arr){
-          let p = new Promise((resolve, reject) => {
-            this.$refs['form'].validateField(item, (err)=>{
-              if(!err){
-                resolve();
-              }else{
-                reject(err);
-              }
-            })
-          });
-          promiseArray.push(p)
-        }
-        Promise.all(promiseArray).then(()=>{
-          callback()
-        }).catch(err=>{
-          callback(err)
-        })
-      },
-      acceptUsername(username){
-        this.model['username'] = username
-      },
-      //账号密码登录
-      handleLogin(rememberMe){
-        this.validateFields([ 'username', 'password', 'inputCode' ], (err)=>{
-          if(!err){
-            let loginParams = {
-              username: this.model.username,
-              password: this.model.password,
-              captcha: this.model.inputCode,
-              checkKey: this.currdatetime,
-              remember_me: rememberMe,
-            }
-            console.log("登录参数", loginParams)
-            this.Login(loginParams).then((res) => {
-              this.$emit('success', res.result)
-            }).catch((err) => {
-              //update-begin-author: taoyan date:20220425 for: 登录页面,当输入验证码错误时,验证码图片要刷新一下,而不是保持旧的验证码图片不变 #41
-              if(err && err.code===412){
-                this.handleChangeCheckCode();
-              }
-              //update-end-author: taoyan date:20220425 for: 登录页面,当输入验证码错误时,验证码图片要刷新一下,而不是保持旧的验证码图片不变 #41
-              this.$emit('fail', err)
-            });
-          }else{
-            this.$emit('validateFail')
-          }
-        })
-      }
-
-
-    }
-
-  }
-</script>
-
-<style scoped>
-
+<template>
+    <div>
+      <a-form-model ref="form" :model="model" :rules="validatorRules">
+        <a-form-model-item required prop="username">
+          <a-input v-model="model.username" size="large" placeholder="请输入帐户名">
+            <a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }"/>
+          </a-input>
+        </a-form-model-item>
+        <a-form-model-item required prop="password">
+          <a-input v-model="model.password" size="large" type="password" autocomplete="false" placeholder="请输入密码">
+            <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
+          </a-input>
+        </a-form-model-item>
+
+        <a-row :gutter="0">
+          <a-col :span="16">
+            <a-form-model-item required prop="inputCode">
+              <a-input v-model="model.inputCode" size="large" type="text" placeholder="请输入验证码">
+                <a-icon slot="prefix" type="smile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
+              </a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="8" style="text-align: right">
+            <img v-if="requestCodeSuccess" style="margin-top: 2px;" :src="randCodeImage" @click="handleChangeCheckCode"/>
+            <img v-else style="margin-top: 2px;" src="../../assets/checkcode.png" @click="handleChangeCheckCode"/>
+          </a-col>
+        </a-row>
+      </a-form-model>
+    </div>
+</template>
+
+<script>
+  import { getAction } from '@/api/manage'
+  import Vue from 'vue'
+  import { mapActions } from 'vuex'
+
+  export default {
+    name: 'LoginAccount',
+    data(){
+      return {
+        requestCodeSuccess: false,
+        randCodeImage: '',
+        currdatetime: '',
+        loginType: 0,
+        model:{
+          username: '',
+          password: '',
+          inputCode: ''
+        },
+        validatorRules:{
+          username: [
+            { required: true, message: '请输入用户名!' },
+            { validator: this.handleUsernameOrEmail }
+          ],
+          password: [{
+            required: true, message: '请输入密码!', validator: 'click'
+          }],
+          inputCode: [{
+            required: true, message: '请输入验证码!'
+          }]
+        }
+
+      }
+    },
+    created() {
+      this.handleChangeCheckCode();
+    },
+    methods:{
+      ...mapActions(['Login']),
+      /**刷新验证码*/
+      handleChangeCheckCode(){
+        this.currdatetime = new Date().getTime();
+        this.model.inputCode = ''
+        getAction(`/sys/randomImage/${this.currdatetime}`).then(res=>{
+          if(res.success){
+            this.randCodeImage = res.result
+            this.requestCodeSuccess=true
+          }else{
+            this.$message.error(res.message)
+            this.requestCodeSuccess=false
+          }
+        }).catch(()=>{
+          this.requestCodeSuccess=false
+        })
+      },
+      // 判断登录类型
+      handleUsernameOrEmail (rule, value, callback) {
+        const regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
+        if (regex.test(value)) {
+          this.loginType = 0
+        } else {
+          this.loginType = 1
+        }
+        callback()
+      },
+      /**
+       * 验证字段
+       * @param arr
+       * @param callback
+       */
+      validateFields(arr, callback){
+        let promiseArray = []
+        for(let item of arr){
+          let p = new Promise((resolve, reject) => {
+            this.$refs['form'].validateField(item, (err)=>{
+              if(!err){
+                resolve();
+              }else{
+                reject(err);
+              }
+            })
+          });
+          promiseArray.push(p)
+        }
+        Promise.all(promiseArray).then(()=>{
+          callback()
+        }).catch(err=>{
+          callback(err)
+        })
+      },
+      acceptUsername(username){
+        this.model['username'] = username
+      },
+      //账号密码登录
+      handleLogin(rememberMe){
+        this.validateFields([ 'username', 'password', 'inputCode' ], (err)=>{
+          if(!err){
+            let loginParams = {
+              username: this.model.username,
+              password: this.model.password,
+              captcha: this.model.inputCode,
+              checkKey: this.currdatetime,
+              remember_me: rememberMe,
+            }
+            console.log("登录参数", loginParams)
+            this.Login(loginParams).then((res) => {
+              this.$emit('success', res.result)
+            }).catch((err) => {
+              //update-begin-author: taoyan date:20220425 for: 登录页面,当输入验证码错误时,验证码图片要刷新一下,而不是保持旧的验证码图片不变 #41
+              if(err && err.code===412){
+                this.handleChangeCheckCode();
+              }
+              //update-end-author: taoyan date:20220425 for: 登录页面,当输入验证码错误时,验证码图片要刷新一下,而不是保持旧的验证码图片不变 #41
+              this.$emit('fail', err)
+            });
+          }else{
+            this.$emit('validateFail')
+          }
+        })
+      }
+
+
+    }
+
+  }
+</script>
+
+<style scoped>
+
 </style>