2.1.3 大屏版本发布

ant-design-vue-jeecg/src/views/system/RoleUserList.vue

@@ -7,11 +7,20 @@
           <!-- 搜索区域 -->
           <a-form layout="inline" @keyup.enter.native="searchQuery">
             <a-row :gutter="24">
-              <a-col :md="12" :sm="12">
+              <a-col :md="12" :sm="8">
                 <a-form-item label="角色名称" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
                   <a-input placeholder="" v-model="queryParam.roleName"></a-input>
                 </a-form-item>
               </a-col>
+              <!--
+              <a-col :md="11" :sm="12">
+                <a-form-item label="创建时间" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
+                  <j-date v-model="queryParam.createTime_begin" :showTime="true" date-format="YYYY-MM-DD HH:mm:ss" style="width:45%" placeholder="请选择开始时间" ></j-date>
+                  <span style="width: 10px;">~</span>
+                  <j-date v-model="queryParam.createTime_end" :showTime="true" date-format="YYYY-MM-DD HH:mm:ss" style="width:45%" placeholder="请选择结束时间"></j-date>
+                </a-form-item>
+              </a-col>
+              -->
               <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
             <a-col :md="12" :sm="24">
                <a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 21px">查询</a-button>
@@ -22,9 +31,9 @@
           </a-form>
         </div>
         <!-- 操作按钮区域 -->
-        <div class="table-operator" style="margin: -8px 0 10px 2px">
+        <div class="table-operator" style="margin: 5px 0 10px 2px">
           <a-button @click="handleAdd" type="primary" icon="plus">角色录入</a-button>
-          <a-button @click="handleEdit(model1)" type="primary" icon="plus">角色编辑</a-button>
+          <!--<a-button @click="handleEdit(model1)" type="primary" icon="plus">角色编辑</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>
@@ -58,6 +67,12 @@
               更多 <a-icon type="down"/>
             </a>
             <a-menu slot="overlay">
+              <a-menu-item>
+                <a @click="handlePerssion(record.id)">授权</a>
+              </a-menu-item>
+              <a-menu-item>
+                <a @click="handleEdit(record)">编辑</a>
+              </a-menu-item>
               <a-menu-item>
                 <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete1(record.id)">
                   <a>删除</a>
@@ -68,10 +83,16 @@
         </span>
           </a-table>
         </div>
+        <!-- 右侧的角色权限配置 -->
+        <user-role-modal ref="modalUserRole"></user-role-modal>
+        <role-modal ref="modalForm" @ok="modalFormOk"></role-modal>
       </a-card>
     </a-col>
-    <a-col :md="rightColMd" :sm="24">
+    <a-col :md="rightColMd" :sm="24" v-if="this.rightcolval == 1">
       <a-card :bordered="false">
+        <div style="text-align: right;">
+          <a-icon type="close-circle" @click="hideUserList" />
+        </div>
         <!-- 查询区域 -->
         <div class="table-page-search-wrapper">
           <a-form layout="inline">
@@ -162,14 +183,18 @@
   import RoleModal from './modules/RoleModal'
   import UserModal from './modules/UserModal'
   import { filterObj } from '@/utils/util'
+  import UserRoleModal from './modules/UserRoleModal'
+  import moment from 'moment'
 
   export default {
     name: 'RoleUserList',
     mixins: [JeecgListMixin],
     components: {
+      UserRoleModal,
       SelectUserModal,
       RoleModal,
-      UserModal
+      UserModal,
+      moment
     },
     data() {
       return {
@@ -218,6 +243,8 @@
         selectedRowKeys2: [],
         selectionRows1: [],
         selectionRows2: [],
+        test:{},
+        rightcolval:0,
         columns:
           [
             {
@@ -230,6 +257,15 @@
               align: 'center',
               dataIndex: 'roleName'
             },
+            {
+              title: '创建时间',
+              dataIndex: 'createTime',
+              align:"center",
+              sorter: true,
+              customRender: (text) => {
+                return moment(text).format('YYYY-MM-DD')
+              }
+            },
             {
               title: '操作',
               dataIndex: 'action',
@@ -302,6 +338,7 @@
         this.selectionRows1 = []
       },
       onSelectChange1(selectedRowKeys, selectionRows) {
+        this.rightcolval = 1
         this.selectedRowKeys1 = selectedRowKeys
         this.selectionRows1 = selectionRows
         this.model1 = Object.assign({}, selectionRows[0])
@@ -455,21 +492,21 @@
         }
       },
       handleOpen(record) {
+        this.rightcolval = 1
         this.selectedRowKeys1 = [record.id]
         this.model1 = Object.assign({}, record)
         this.currentRoleId = record.id
         this.onClearSelected2()
         this.loadData2()
       },
-
-      handleEdit: function(record) {
+      /*handleEdit: function(record) {
         if (this.currentRoleId == '') {
           this.$message.error('请选择一个角色!')
         } else {
           this.$refs.modalForm.edit(record)
           this.$refs.modalForm.title = '编辑'
         }
-      },
+      },*/
       searchQuery2() {
         this.loadData2(1)
       },
@@ -486,6 +523,13 @@
         }
         this.ipagination2 = pagination
         this.loadData2()
+      },
+      hideUserList(){
+        //this.rightcolval = 0
+        this.selectedRowKeys1 = []
+      },
+      handlePerssion(roleId){
+        this.$refs.modalUserRole.show(roleId);
       }
     }
   }