【update】-工作组分发增加成员单位的显示

2023-05-19 14:31:48 +08:00
parent 3114cbc628
commit dbe4d00990
1 changed files with 160 additions and 130 deletions
@@ -9,22 +9,36 @@
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
-      <a-form :form="form" v-if="memberList[0].children.length > 0">
-        <a-row>
-          <a-col :span="2"></a-col>
-          <a-col :span="20">
-            <a-form-item label="成员单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-tree
-                :expanded-keys="['0-0']"
-                :tree-data="memberList"
-                :replaceFields="replaceFields"
-                checkable
-                @check="onCheck"/>
-              <a-input style="display: none" v-decorator="['memberName',validatorRules.memberName]"></a-input>
-            </a-form-item>
-          </a-col>
-        </a-row>
-      </a-form>
+
+      <template  v-if="dataSourceInit.length > 0">
+        <!--    操作按钮区域-->
+        <div class="table-operator">
+          <a-button type="primary"  @click="checkAll()">全选</a-button>
+        </div>
+        <a-table
+          size="middle"
+          ref="table"
+          bordered
+          rowKey="id"
+          :columns="columns"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          :loading="false"
+          :scroll="{x: 500}"
+          @change="handleTableChange"
+          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+          class="j-table-force-nowrap main-table">
+
+          <template slot="text" slot-scope="text">
+            <a-tooltip>
+              <template slot="title">{{ text }}</template>
+              <div class="table-text">{{ text }}</div>
+            </a-tooltip>
+          </template>
+
+        </a-table>
+      </template>
+
      <a-empty v-else></a-empty>
    </a-spin>

@@ -80,39 +94,40 @@ export default {
  data() {
    return {
      title: '分发',
-      width: 500,
+      width: 1000,
      confirmLoading: false,
-      form: this.$form.createForm(this),
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 17 }
-      },
-      memberList: [{
-        name: '全选',
-        children: []
-      }], // 成员树
-      checkedKeys: [], // 已选中的成员数组
-      replaceFields: {
-        children: 'children',
-        title: 'name',
-        value: 'id',
-        key: 'id'
-      },
-      validatorRules: {
-        memberName: {
-          rules: [{ required: true, message: '请选择成员单位' }],
-          validateTrigger: 'change'
+      columns: [
+        {
+          title: '联系人',
+          align: 'center',
+          dataIndex: 'name',
+          width: 280,
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: '成员单位',
+          align: 'center',
+          dataIndex: 'companyName',
+          width: 280,
+          scopedSlots: { customRender: 'text' }
        }
+      ],
+      dataSource: [], // 表格中显示的数据
+      dataSourceInit: [], // 所有分发单位的数据
+      /* 分页参数 */
+      ipagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '20', '30', '50', '100'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' 共' + total + '条'
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
      },
-      url: {
-        memberList: '', // 成员单位列表
-        distribute: '', // 分发
-        distributeBatch: '' // 批量分发
-      }
+      /* table选中keys*/
+      selectedRowKeys: []
    }
  },
  methods: {
@@ -127,7 +142,8 @@ export default {
      }
      distributeMemberList(param).then(res => {
        if (res.success) {
-          this.memberList[0].children = res.result
+          this.dataSourceInit = res.result || []
+          this.loadData(1)
        } else {
          this.$message.warn(res.message)
        }
@@ -143,117 +159,128 @@ export default {
     */
    initData() {
      this.checkedKeys = []
+      this.selectedRowKeys = []
+      this.ipagination.current = 1
+      this.ipagination.pageSize = 10
      this.getMemberList()
+
+    },
+    handleTableChange(pagination) {
+      //分页、排序、筛选变化时触发
+      this.ipagination = pagination
+      this.loadData()
+    },
+    onSelectChange(selectedRowKeys) {
+      this.selectedRowKeys = selectedRowKeys
+    },
+    getQueryParams() {
+      //获取查询条件
+      let sqp = {}
+      var param = Object.assign(sqp, this.lastQueryParam)
+      param.pageNo = this.ipagination.current
+      param.pageSize = this.ipagination.pageSize
+      return param
+    },
+    loadData(arg) {
+      //加载数据 若传入参数1则加载第一页的内容
+      if (arg === 1) {
+        this.ipagination.current = 1
+      }
+      var params = this.getQueryParams()//查询条件
+      this.ipagination.total = this.dataSourceInit.length
+      this.dataSource = this.dataSourceInit.slice((params.pageNo - 1) * params.pageSize, (params.pageNo * params.pageSize))
+    },
+    checkAll() {
+      this.selectedRowKeys = this.dataSourceInit.map(tt => tt.id)
    },
    close() {
      this.$emit('update:visible', false)
      this.$emit('close')
-      this.memberList = [{
-        name: '全选',
-        children: []
-      }]
    },
    handleOk() {
      if (this.confirmLoading) {
        return
      }
      this.confirmLoading = true
-      if (this.memberList[0].children.length === 0) {
+      if (this.dataSourceInit.length === 0) {
        this.$message.warn('当前工作组暂无成员，无法分发文件')
        this.confirmLoading = false
        return
      }
-      if (this.checkedKeys.length === 0) {
-        this.form.validateFields()
+      if (this.selectedRowKeys.length === 0) {
+        this.$message.warn('请选择成员单位')
        this.confirmLoading = false
        return
      }
-      let str = ''
-      if (this.checkedKeys[0] === '0-0') {
-        str = this.checkedKeys.slice(1).join(',').toString()
-      } else {
-        str = this.checkedKeys.join(',').toString()
-      }
-      this.form.setFieldsValue({ memberName: str })
-      this.form.validateFields((err) => {
-        if (!err) {
-          this.confirmLoading = true
-          if (this.isBatch) {
-            // 批量分发
-            const formData = {
-              contactsIds: str,
-              dataIds: this.recordId,
-              projectId: this.projectId,
-              projectType: this.projectType
-            }
-            batchDistribute(formData).then(res => {
-              if (res.success) {
-                this.$message.success(res.message)
-                // 是否有邮件发送失败 有就给出提示信息
-                if (Array.isArray(res.result) && res.result.length > 0) {
-                  // msgWarn(this,res.result,0)
-                  this.$refs.emailError.open()
-                  this.$refs.emailError.msgList = res.result
-                  console.log(this.$refs.emailError.msgList, 'this.$refs.emailError.msgList ')
-                }
-                this.close()
-                this.$emit('ok')
-              } else {
-                this.$message.warn(res.message)
-              }
-            }).finally(() => {
-              setTimeout(() => {
-                this.confirmLoading = false
-              }, 1000)
-            })
-          } else {
-            // 单个分发
-            const formData = {
-              contactsIds: this.checkedKeys.join(','),
-              dataId: this.recordId,
-              projectId: this.projectId,
-              projectType: this.projectType
-            }
-            distribute(formData).then(res => {
-              if (res.success) {
-                this.$message.success(res.message)
-                if (Array.isArray(res.result) && res.result.length > 0) {
-                  // msgWarn(this,res.result,0)
-                  this.$refs.emailError.open()
-                  this.$refs.emailError.msgList = res.result
-                  console.log(this.$refs.emailError.msgList, 'this.$refs.emailError.msgList ')
-                }
-                this.close()
-                this.$emit('ok')
-              } else {
-                this.$message.warn(res.message)
-              }
-            }).finally(() => {
-              setTimeout(() => {
-                this.confirmLoading = false
-              }, 1000)
-            })
-          }
-        } else {
-          this.confirmLoading = false
+
+      if (this.isBatch) {
+        let str = this.selectedRowKeys.join(',')
+        // 批量分发
+        const formData = {
+          contactsIds: str,
+          dataIds: this.recordId,
+          projectId: this.projectId,
+          projectType: this.projectType
        }
-      })
+        batchDistribute(formData).then(res => {
+          if (res.success) {
+            this.$message.success(res.message)
+            // 是否有邮件发送失败 有就给出提示信息
+            if (Array.isArray(res.result) && res.result.length > 0) {
+              // msgWarn(this,res.result,0)
+              this.$refs.emailError.open()
+              this.$refs.emailError.msgList = res.result
+              console.log(this.$refs.emailError.msgList, 'this.$refs.emailError.msgList ')
+            }
+            this.close()
+            this.$emit('ok')
+          } else {
+            this.$message.warn(res.message)
+          }
+        }).finally(() => {
+          setTimeout(() => {
+            this.confirmLoading = false
+          }, 1000)
+        })
+      } else {
+        // 单个分发
+        const formData = {
+          contactsIds: this.selectedRowKeys.join(','),
+          dataId: this.recordId,
+          projectId: this.projectId,
+          projectType: this.projectType
+        }
+        distribute(formData).then(res => {
+          if (res.success) {
+            this.$message.success(res.message)
+            if (Array.isArray(res.result) && res.result.length > 0) {
+              // msgWarn(this,res.result,0)
+              this.$refs.emailError.open()
+              this.$refs.emailError.msgList = res.result
+              console.log(this.$refs.emailError.msgList, 'this.$refs.emailError.msgList ')
+            }
+            this.close()
+            this.$emit('ok')
+          } else {
+            this.$message.warn(res.message)
+          }
+        }).finally(() => {
+          setTimeout(() => {
+            this.confirmLoading = false
+          }, 1000)
+        })
+      }
+
    },
    handleCancel() {
      this.close()
-    },
-    checkMember(rules, value, callback) {
-      if (this.checkedKeys.length === 0) {
-        callback('请选选择成员')
-      } else {
-        callback()
-      }
    }
  }
 }
 </script>

 <style scoped lang="less">
+@import '~@assets/less/common.less';
 .no-upload {
  /deep/ .ant-upload-select-text {
    display: none;
@@ -279,4 +306,7 @@ export default {
  overflow: hidden;
  text-overflow: ellipsis;
 }
+/deep/ .ant-table-body {
+  overflow-x: auto !important;
+}
 </style>