议事管理指定人员优化

lin

2024-03-26 75b539a34ca2215f60ee1407964af90b975f5f82

议事管理指定人员优化

 src/api/system/user.js

@@ -139,12 +139,14 @@
  })
}

export const getUserlnfoByDistrictlds = (districtIds) => {
export const getUserlnfoByDistrictlds = (current, size, params) => {
  return request({
    url: '/api/blade-system/user/getUserInfoByDistrictIds',
    method: 'get',
    params: {
      districtIds,
      ...params,
      current,
      size,
    }
  })
}

 src/views/article/components/discussionManageChild.vue

@@ -4,6 +4,9 @@
      @close="handleClose" @open="opens">
      <avue-form ref="DisCussFrom" :option="option" v-model="froms" @submit="handleSubmit"></avue-form>
    </el-dialog>

    <userList ref="userList" @selectPersonList="selectPersonList"></userList>

  </div>
</template>

@@ -27,6 +30,8 @@
  import {
    getDictionary
  } from '@/api/system/dict'
  import userList from "./userList.vue";


  // import {
  //   getList as getHouseholdList,
@@ -39,6 +44,9 @@

  let formData = {}
  export default {
    components: {
      userList
    },
    data() {
      return {
        dialogVisibles: false,
@@ -178,9 +186,9 @@
            {
              display: false,
              label: "选择用户",
              prop: "userIds",
              prop: "userName",
              tags: true,
              type: "tree",
              type: "input",
              multiple: true,
              span: 12,
              offset: 8,
@@ -188,16 +196,25 @@
              hide: true,
              row: true,
              // dicUrl: `/api/blade-system/user/getUserlnfoByDistrictlds?districtlds={{}}`,
              props: {
                label: 'name',
                value: 'id',
              },
              dicData: [],
              // props: {
              //   label: 'name',
              //   value: 'id',
              // },
              // dicData: [],
              rules: [{
                required: true,
                message: '请输入姓名',
                trigger: 'blur'
              }],
              focus: ({
                value,
                column
              }) => {
                // this.$message.success('focus事件查看控制台')
                // console.log('获取焦点', value, column)
                // this.$refs.userList && this.$refs.userList.resetForm()
                this.$refs.userList.show(this.discussion.articleRange)
              },
            },

            {
@@ -231,7 +248,8 @@
        dialogVisibles: false,
        articleId: '',
        discussion: {},
        id: ""
        id: "",
        personList: [],
      }
    },
    created() {
@@ -245,9 +263,10 @@
    watch: {
      'froms.appointUser': {
        handler(newData) {
          const column = this.findObject(this.option.column, "userIds")
          const column = this.findObject(this.option.column, "userName")
          if (newData == 1) {
            column.display = true
            // this.$refs.userList.show()
          } else {
            column.display = false
          }
@@ -265,6 +284,14 @@
      }
    },
    methods: {
      selectPersonList(personList) {
        console.log(personList, "++++++++++++")
        this.personList = personList
        let nameList = personList.map(e => {
          return e.name
        })
        this.froms.userName = nameList.join(",")
      },
      getuserInfoByDistrictId() {
        getUserlnfoByDistrictlds(this.discussion.articleRange).then(res => {
          const column = this.findObject(this.option.column, "userIds")
@@ -280,7 +307,8 @@
      handleSubmit(form, done) {
        form.articleId = this.articleId
        form.eventType = 1
        form.userIds = JSON.stringify(form.userIds)
        form.userIds = this.personList.map(e => e.id).join(",")
        // form.userIds = JSON.stringify(form.userIds)
        if (form.appointUser == 0) {
          form.userIds = ''
        }
@@ -376,7 +404,7 @@
              this.froms.userIds = JSON.parse(this.froms.userIds)
            }
          }
          this.getuserInfoByDistrictId()
          // this.getuserInfoByDistrictId()

        })
      },

 src/views/article/components/userList.vue

New file
@@ -0,0 +1,255 @@
<template>
  <el-dialog class="dept-user-table-dialog" width="70%" title="选择接收人" modal-append-to-body="false" append-to-body="true"
    :close-on-click-model="true" :visible.sync="showDialog" @close="showDialog = false">
    <!-- <div class="left">
      <el-scrollbar>
        <basic-container>
          <avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick" />
        </basic-container>
      </el-scrollbar>
    </div> -->
    <div class="right">
      <avue-crud :option="option" :search.sync="search" :table-loading="loading" :data="data" ref="crud" v-model="form"
        :page.sync="page" @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
        @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange"></avue-crud>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="showDialog = false">取 消</el-button>
      <el-button type="primary" @click="submit">确 定</el-button>
    </div>
  </el-dialog>


</template>

<script>
  import {
    getDeptLazyTree
  } from "@/api/system/dept";
  import {
    getUserlnfoByDistrictlds
  } from "@/api/system/user";
  import {
    mapGetters
  } from "vuex";

  export default {
    name: "DeptUserTable",
    data() {
      return {
        showDialog: false,
        form: {},
        search: {},
        selectionList: [],
        query: {},
        loading: true,
        platformLoading: false,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        treeDeptId: '',
        treeData: [],
        treeOption: {
          nodeKey: 'id',
          lazy: true,
          treeLoad: function(node, resolve) {
            const parentId = (node.level === 0) ? 0 : node.data.id
            getDeptLazyTree(parentId).then(res => {
              resolve(res.data.data.map(item => {
                return {
                  ...item,
                  leaf: !item.hasChildren
                }
              }))
            })
          },
          addBtn: false,
          menu: false,
          size: 'small',
          props: {
            labelText: '标题',
            label: 'title',
            value: 'value',
            children: 'children'
          }
        },
        option: {
          height: 'auto',
          calcHeight: 120,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          selection: true,
          viewBtn: true,
          dialogType: 'drawer',
          dialogClickModal: false,
          menu: false,
          addBtn: false,
          rowKey: "id",
          reserveSelection: true,
          column: [{
              label: "用户姓名",
              prop: "name",
              search: true,
              searchSpan: 4,
              display: false
            },
            {
              label: "电话",
              prop: "phoneNumber",
              slot: true,
              searchSpan: 4,
              search: true,
              display: false
            },
            {
              label: "地址",
              width: 560,
              prop: "address",
              slot: true,
              display: false
            },
            {
              label: "楼栋",
              prop: "building",
              slot: true,
              searchSpan: 4,
              search: true,
              display: false
            },
            {
              label: "单元",
              prop: "unit",
              searchSpan: 4,
              slot: true,
              search: true,
              display: false
            },

          ],
        },
        data: [],
        articleRange: '',
      }
    },
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      ids() {
        let ids = []
        this.selectionList.forEach(ele => {
          console.log(ele, "---------")
          ids.push(ele.id)
        })
        return ids.join(",")
      },
      idsList() {
        let ids = []
        this.selectionList.forEach(ele => {
          ids.push({
            id: ele.id,
            name: ele.name
          })
        })
        return ids
      }
    },
    methods: {
      submit() {
        this.$emit("selectPersonList", this.idsList)
        this.showDialog = false
      },

      show(articleRange) {
        console.log("***111111111111111111***", articleRange)
        this.articleRange = articleRange
        this.showDialog = true
        this.onLoad(this.page)
      },

      nodeClick(data) {
        this.treeDeptId = data.id
        this.page.currentPage = 1
        this.onLoad(this.page)
      },
      searchReset() {
        this.query = {}
        this.treeDeptId = ''
        this.onLoad(this.page)
      },
      searchChange(params, done) {
        this.query = params
        this.page.currentPage = 1
        this.onLoad(this.page, params)
        done()
      },
      selectionChange(list) {
        console.log(list, "list")
        this.selectionList = list
      },
      selectionClear() {
        this.selectionList = []
        this.$refs.crud.toggleSelection()
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
      },
      refreshChange() {
        this.onLoad(this.page, this.query)
      },
      onLoad(page, params = {}) {
        this.loading = true
        params.districtIds = this.articleRange
        getUserlnfoByDistrictlds(page.currentPage, page.pageSize, Object.assign(params, this.query), this.treeDeptId)
          .then(res => {
            const data = res.data.data
            this.page.total = data.total
            this.data = data.records
            this.loading = false
            // this.selectionClear()
          })
      },
    }
  }
</script>

<style lang="scss">
  .dept-user-table-dialog {
    margin: 0 !important;

    .el-dialog {
      display: flex;
      flex-direction: column;
      margin: auto !important;
      position: absolute;
      top: 0 !important;
      left: 0 !important;
      right: 0 !important;
      bottom: 0 !important;
      //width: 1000px !important;
      height: 800px !important;

      .el-dialog__body {
        height: 0 !important;
        flex: 1;
        display: flex;

        .left {
          width: 0;
          flex: 2;
        }

        .right {
          margin-left: 10px;
          flex: 9;
        }
      }
    }
  }
</style>