[update] 企标计划和企标临时权限设置联调

src/components/selection/UserSelectModal.vue

@@ -59,55 +59,32 @@
       </a-form>
     </div>
     <div class="modal-content">
-      <div class="modal-content-left">
-        <div class="modal-content-title-div">
-          <p class="modal-content-title">{{ $t('userSelect.select') }}</p>
-          <div class="table-operator-tab">
-            <a class="switch-item table-operator-tab-active">{{ $t('userSelect.userList') }}</a>
-          </div>
-        </div>
-        <a-table
-          :columns="columns"
-          rowKey="id"
-          bordered
-          :scroll="{x: 550}"
-          :data-source="dataSource"
-          :pagination="ipagination"
-          :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: type }"
-          :loading="loadingLeft"
-          @change="leftTableChange">
-          <template slot="text" slot-scope="text">
-            <a-tooltip overlay-class-name="tooltip-style">
-              <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
-              <div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
-            </a-tooltip>
-          </template>
-        </a-table>
-      </div>
-      <div class="modal-content-right">
-        <div class="modal-content-title-div">
-          <p class="modal-content-title">选择</p>
-        </div>
-        <a-table
-          :columns="columnsRight"
-          rowKey="id"
-          :pagination="false"
-          bordered
-          :scroll="{x: 250}"
-          :loading="loadingRight"
-          :data-source="dataSourceRight">
-          <template slot="text" slot-scope="text">
-            <a-tooltip overlay-class-name="tooltip-style">
-              <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
-              <div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
-            </a-tooltip>
-          </template>
-          <template slot="action" slot-scope="text, record, index">
-            <a @click="handleDelete(record, index)" >{{ $t('delete') }}</a>
-          </template>
-        </a-table>
+      <a-table
+        :columns="columns"
+        rowKey="id"
+        bordered
+        :scroll="{x: '100%'}"
+        :data-source="dataSource"
+        :pagination="ipagination"
+        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: type }"
+        :loading="loadingLeft"
+        @change="leftTableChange">
+        <template slot="text" slot-scope="text">
+          <a-tooltip overlay-class-name="tooltip-style">
+            <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
+            <div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
+          </a-tooltip>
+        </template>
+      </a-table>
+    </div>
+    <p class="modal-content-title">{{ $t('userSelect.selectedPersonnel') }}</p>
+    <div v-if="dataSourceRight && dataSourceRight.length > 0" class="name-content">
+      <div v-for="item in dataSourceRight" :key="item.id" class="name-div">
+        {{ item.realname + '(' + item.workNo + ')' }}
+        <a-icon type="close" @click="handleDelete(item)" />
       </div>
     </div>
+    <a-empty v-else/>
   </a-modal>
 </template>
 
@@ -136,8 +113,10 @@ export default {
       immediate: true,
       handler (val) {
         console.log(val)
-        this.selectedRowKeys = val.split(',')
-        this.getUserListByIds(val)
+        if (val) {
+          this.selectedRowKeys = val ? val.split(',') : []
+          this.getUserListByIds(val)
+        }
       }
     }
   },
@@ -193,25 +172,10 @@ export default {
       },
       selectedRowKeys: [],
       loadingLeft: false,
-      columnsRight: [
-        {
-          title: this.$t('userSelect.name'),
-          dataIndex: 'realname',
-          align: 'center',
-          scopedSlots: { customRender: 'text' }
-        },
-        {
-          title: this.$t('operation'),
-          dataIndex: 'action',
-          scopedSlots: { customRender: 'action' },
-          align: 'center'
-        }
-      ],
-      loadingRight: false,
       dataSourceRight: [],
       url: {
         userList: '/sys/user/page',
-        userListByIds: ''
+        userListByIds: '/sys/user/queryByIds'
       }
     }
   },
@@ -280,7 +244,7 @@ export default {
         this.loadingLeft = false
       })
     },
-    // 左侧选择
+    // 表格选择
     onSelectChange (selectedRowKeys, selectedRows) {
       this.selectedRowKeys = selectedRowKeys
       if (this.type === 'checkbox') {
@@ -313,11 +277,11 @@ export default {
     // 根据ids获取用户列表
     getUserListByIds (ids) {
       const params = {}
-      params.ids = ids
+      params.userIds = ids
       this.loadingRight = true
       getAction(this.url.userListByIds, params).then((res) => {
         if (res.success) {
-          this.dataSourceRight = res.result.records || []
+          this.dataSourceRight = res.result || []
         } else {
           this.$message.warn(res.message)
         }
@@ -325,11 +289,10 @@ export default {
         this.loadingRight = false
       })
     },
-    // 右侧表的删除
+    // 名字列表的删除
     handleDelete (record, index) {
       this.dataSourceRight.splice(index, 1)
       this.selectedRowKeys = this.selectedRowKeys.filter(item => item !== record.id)
-      console.log(this.selectedRowKeys)
     },
     handleOk () {
       this.$emit('change', this.selectedRowKeys.join(','))
@@ -353,23 +316,38 @@ export default {
   width: 100%;
   display: flex;
   justify-content: space-between;
-&-left {
-   width: 58%;
- }
-&-right {
-   width: 40%;
- }
-&-title-div {
-   display: flex;
-   align-items: center;
-   height: 28px;
-   margin: 20px 0;
-.modal-content-title {
-  color: #1D2129;
-  font-weight: 500;
-  margin-right: 12px;
-  margin-bottom: 0;
-}
+  &-left {
+     width: 58%;
+  }
+  &-right {
+     width: 40%;
+  }
+  &-title-div {
+    display: flex;
+    align-items: center;
+    height: 28px;
+    margin: 20px 0;
+    .modal-content-title {
+      color: #1D2129;
+      font-weight: 500;
+      margin-right: 12px;
+      margin-bottom: 0;
+    }
+  }
 }
+.name-content {
+  display: flex;
+  .name-div {
+    width: auto;
+    padding: 5px 16px;
+    margin-right: 12px;
+    background: rgba(213, 44, 38, 0.08);
+    border-radius: 4px 4px 4px 4px;
+    opacity: 1;
+    color: #D52C26;
+    /deep/ .anticon {
+      margin-left: 4px;
+    }
+  }
 }
 </style>

src/components/selection/UserSelection.vue

@@ -16,7 +16,7 @@
         {{ $t('userSelect.select') }}
       </a-button>
     </div>
-    <user-select-modal v-bind="$attrs" ref="selectModal" @change="selectChange" @nameChange="nameChange"></user-select-modal>
+    <user-select-modal v-bind="$attrs" :nameStr="nameStr" ref="selectModal" @change="selectChange" @nameChange="nameChange"></user-select-modal>
   </div>
 </template>