责任人增加筛选条件

zhouwx

2024-08-19 3cc4abeb92d11d7a8b365928c5aa9452679fe06c

 src/views/Admin/sameLevel.vue

@@ -1,46 +1,66 @@
<template>
  <div class="inner">
    <a-row type="flex" justify="space-between" style="margin-bottom: 20px">
      <a-col :span="4">
      <a-col :span="4" v-if="unittype && unittype !== null" style="margin-bottom: 10px">
        <a-button type="primary" @click="editData('add',{})">新增用户</a-button>
      </a-col>
      <a-col :span="20">
        <a-row type="flex" justify="end" :gutter="12">
      <a-col :span="24">
        <a-row type="flex" :gutter="24">
          <a-col :span="4">
            <a-cascader :options="areaData" v-model="areaVal" placeholder="行政规划" expandTrigger="hover" changeOnSelect @change="onChange" style="width: 100%"/>
            <a-select v-model="search.searchParams.peerRecipientGroupId" placeholder="选择分组" style="width: 100%" @change="handleChange" allowClear show-search :filter-option="filterOption">
              <a-select-option v-for="item in groupData" :value="item.id" :key="item.id">{{item.name}}</a-select-option>
            </a-select>
          </a-col>
          <a-col :span="4">
            <a-button type="primary" @click="getUserList">查询</a-button>
          <a-col :span="3">
            <a-input v-model="search.searchParams.company" placeholder="单位名称" style="width: 100%"/>
          </a-col>
          <a-col :span="3">
            <a-input v-model="search.searchParams.name" placeholder="姓名" style="width: 100%"/>
          </a-col>
          <a-col :span="3">
            <a-input v-model="search.searchParams.phone" placeholder="电话" style="width: 100%"/>
          </a-col>
          <a-col :span="4" v-if="unittype == null || !unittype">
            <a-cascader :options="areaData" v-model="areaVal" placeholder="所属区域" expandTrigger="hover" :fieldNames="fieldNames" changeOnSelect @change="onChange" style="width: 100%"/>
          </a-col>
          <a-col :span="6">
            <a-button type="primary" @click="getUserList" v-preventReClick="1500">查询</a-button>
            <a-button style="margin-left: 12px" @click="resetSearch">重置</a-button>
            <a-button type="danger" style="margin-left: 12px" @click="delBySet">批量删除</a-button>
          </a-col>
        </a-row>
      </a-col>
    </a-row>
    <div class="table-cont">
      <a-table :columns="columns" :data-source="tableData" :pagination="pagination" :rowKey="record=>record.name" bordered>
        <template #levels="level">
      <a-table :columns="columns" :data-source="tableData" :pagination="pagination" :rowKey="record=>record.id" bordered :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
        <template #unittype="unittype">
          <a-tag
            :color="level === 1 ? 'pink' : level === 2 ? 'blue' : 'green'"
              :color="unittype === 1 ? 'purple' : unittype === 2 ? 'blue' : unittype === 3 ? 'cyan' : 'green'"
          >
            {{ level === 1 ? '省级' : level === 2 ? '地（市、州）级' : level === 3 ? '区县级' : '村（乡、镇）级' }}
            {{ unittype==1?'省级':unittype==2?'地（市、州）级':unittype==3?'区县级':unittype==4?'村（乡、镇）级':'管理员' }}
          </a-tag>
        </template>
        <template #area="area">
          {{findAreaById(areaData,area)}}
        <template #area="text,row">
          <span v-if="row.province !== null && row.province !== ''">{{row.province}}</span>
          <span v-if="row.city !== null && row.city !== ''">-{{row.city}}</span>
          <span v-if="row.area !== null && row.area !== ''">-{{row.area}}</span>
          <span v-if="row.town !== null && row.town !== ''">-{{row.town}}</span>
        </template>
        <template #action="action,row">
          <a-button type="link" @click="editData('edit',row)">编辑</a-button>
          <a-button type="link" class="delBtn">删除</a-button>
          <a-button type="link" class="delBtn" @click="delData(row)">删除</a-button>
        </template>
      </a-table>
    </div>
    <same-level-mod ref="sameLevelMod" @refrech="getUserList"></same-level-mod>
    <same-level-mod ref="sameLevelMod" @refresh="getUserList"></same-level-mod>
  </div>
</template>

<script>
import {getUser} from '@/api/user'
import {delRecipient, delRecipientBatch, delUser, getRecipient, getSameLevelGroupList, getUser} from '@/api/user'
import sameLevelMod from "@/views/Admin/components/sameLevelMod"
import {getUserInfo} from "@/util/storage";
import {getDistrictInfo} from "@/api/login";
export default {
  name: 'sameLevel',
  components: {
@@ -49,23 +69,38 @@
  data () {
    return {
      areaVal: [],
      unittype: null,
      districtId: null,
      search:{
        pageIndex: 1,
        pageSize: 10,
        searchParams:{
          districtId: null
          company: '',
          province: '',
          city: '',
          area: '',
          town: '',
          name: '',
          phone: '',
          peerRecipientGroupId: undefined
        }
      },
      selectedRowKeys: [],
      columns:[
        {
          title: '单位名称',
          dataIndex: 'depName',
          key: 'depName'
          dataIndex: 'company',
          key: 'company'
        },
        {
          title: '接收人姓名',
          dataIndex: 'name',
          key: 'name'
          dataIndex: 'recipientName',
          key: 'recipientName'
        },
        {
          title: '所属分组',
          dataIndex: 'peerRecipientGroupName',
          key: 'peerRecipientGroupName'
        },
        {
          title: '手机号码',
@@ -74,98 +109,100 @@
        },
        {
          title: '级别',
          dataIndex: 'level',
          key: 'level',
          scopedSlots: { customRender: 'levels' }
          dataIndex: 'unittype',
          // key: 'unittype',
          scopedSlots: { customRender: 'unittype' }
        },
        {
          title: '行政区划',
          dataIndex: 'area',
          key: 'area',
          // key: 'area',
          scopedSlots: { customRender: 'area' }
        },
        {
          title: '操作',
          width: '12%',
          key: 'action',
          scopedSlots: { customRender: 'action' }
        },
      ],
      tableData: [
        {
          depName: '阿勒泰地区自然资源局',
          name: 'John Brown',
          phone: '15261806177',
          level: 1,
          area: 111
        },
        {
          depName: '阿勒泰地区公安局',
          name: 'Jim Green',
          phone: '15261806178',
          level: 2,
          area: 211
        },
        {
          depName: '阿勒泰地区自然资源局',
          name: 'Joe Black',
          phone: '15261806176',
          level: 3,
          area: 11
        },
      ],
      tableData: [],
      groupData: [],
      pagination: {
        current: 1,
        defaultCurrent: 1,
        defaultPageSize: 10,
        total: 11,
        onChange: ( page, pageSize ) => this.onPageChange(page,pageSize)
        total: 0,
        onChange: ( page, pageSize ) => this.onPageChange(page,pageSize),
        showTotal: total => `共 ${total} 条`
      },
      areaData: [
        {
          value: 1,
          label: '江苏省',
          children: [
            {
              value: 11,
              label: '苏州市',
              children: [
                {
                  value: 111,
                  label: '工业园区',
                },
              ],
            },
          ],
        },
        {
          value: 2,
          label: '新疆维吾尔自治区',
          children: [
            {
              value: 21,
              label: '乌鲁木齐市',
              children: [
                {
                  value: 211,
                  label: '国泰新华',
                },
              ],
            },
          ],
        },
      ]
      areaData: [],
      fieldNames:{
        label: 'name',
        value: 'id',
        children: 'children'
      }
    }
  },
  created() {
    const t = this
    t.groupData = []
    t.unittype = getUserInfo().unittype
    t.districtId = getUserInfo().districtId
    t.getGroupList()
    t.getUserList()
    t.getDistrictInfo()
  },
  methods:{
    async getUserList(){
      const t = this
      const res = await getUser(t.search)
      if(t.search.searchParams.phone == '' && t.search.searchParams.recipientName == '' && t.search.searchParams.province == '' && t.search.searchParams.city == '' && t.search.searchParams.area == '' && t.search.searchParams.company == '' && t.search.searchParams.peerRecipientGroupId == undefined){
        const {searchParams,...data} = t.search
        console.log(data,'data')
        const res = await getRecipient(data)
        if(res.data.code == 100){
          t.tableData = res.data.data
          t.pagination.total = res.data.total
        }else{
          t.$message.warning(res.data.msg);
        }
      }else{
        const res = await getRecipient(t.search)
        if(res.data.code == 100){
          t.tableData = res.data.data
          t.pagination.total = res.data.total
        }else{
          t.$message.warning(res.data.msg);
        }
      }
    },

    async getDistrictInfo(){
      let res = await getDistrictInfo()
      if(res.data.code == 100){
        this.areaData = res.data.data
      } else {
        this.$message.warning(res.data.msg);
      }
    },

    async getGroupList() {
      const t = this
      const res = await getSameLevelGroupList();
      if(res.data.code == 100){
        if(res.data.data){
          let arr = res.data.data
          t.groupData = arr.concat([{id: -1, name: '未分类'}])
        }else{
          t.groupData = [{
            id: -1,
            name: '未分类'
          }]
        }
      }else{
        this.$message.error(res.data.msg)
      }
    },
    resetSearch(){
      const t = this
      t.areaVal = []
@@ -173,7 +210,14 @@
        pageIndex: 1,
        pageSize: 10,
        searchParams:{
          districtId: null
          company: '',
          province: '',
          city: '',
          area: '',
          town: '',
          name: '',
          phone: '',
          peerRecipientGroupId: undefined
        }
      }
      t.getUserList()
@@ -181,33 +225,121 @@

    editData(type,data){
      const t = this
      t.$refs.sameLevelMod.openDialog(type,data)
      t.$refs.sameLevelMod.openDialog(type,data,t.groupData)
      t.$refs.sameLevelMod.areaData = t.areaData
      t.$refs.sameLevelMod.form.unittype = t.unittype
      t.$refs.sameLevelMod.form.districtId = t.districtId
    },

    filterOption(input, option) {
      return (
          option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },

    async delData(row){
      const t = this
      this.$confirm({
        title: '提示',
        content: h => <div>是否删除该条用户信息？</div>,
        cancelText: '取消',
        okText: '确认',
        centered: true,
        onOk() {
          delRecipient(row.id).then(res=>{
            if(res.data.code == 100){
              t.$message.success('删除用户信息成功');
              t.getUserList()
            }else{
              t.$message.warning(res.data.msg);
            }
          })
        },
        onCancel() {
          console.log('Cancel');
        },
      });
    },

    // 根据id查对象
    findCodeById(data,value) {
      for (const node of data) {
        if (node.id === value) {
          return node;
        }
        if (node.children) {
          const foundNode = this.findCodeById(node.children, value);
          if (foundNode) {
            return foundNode;
          }
        }
      }
      return null;
    },

    async delBySet(){
      const t = this
      this.$confirm({
        title: '提示',
        content: h => <div>是否删除所选用户信息？</div>,
        cancelText: '取消',
        okText: '确认',
        centered: true,
        onOk() {
          delRecipientBatch(t.selectedRowKeys.join(',')).then(res=>{
            if(res.data.code == 100){
              t.$message.success('删除用户信息成功');
              t.getUserList()
              t.selectedRowKeys = []
            }else{
              t.$message.warning(res.data.msg);
            }
          })
        },
        onCancel() {
          console.log('Cancel');
        },
      });
    },

    onPageChange(page, pageSize) {
      const t= this
      t.pagination.current = page
      t.search.pageIndex = page
      t.getUserList()
    },
    onChange(value) {
      const t = this
      t.search.searchParams.districtId = value[value.length - 1]
    },

    findAreaById(data,value) {
      for (const node of data) {
        if (node.value === value) {
          return node.label;
        }
        if (node.children) {
          const foundLabel = this.findAreaById(node.children, value);
          if (foundLabel) {
            return foundLabel;
          }
        }
      t.search.searchParams = {
        company: '',
        province: '',
        city: '',
        area: '',
        town: '',
        name: '',
        phone: '',
        peerRecipientGroupId: undefined
      }
      return null;
    }
      if(value[0]){
        t.search.searchParams.province = t.findCodeById(t.areaData,value[0]).name
      }
      if(value[1]){
        t.search.searchParams.city = t.findCodeById(t.areaData,value[1]).name
      }
      if(value[2]){
        t.search.searchParams.area = t.findCodeById(t.areaData,value[2]).name
      }
      if(value[3]){
        t.search.searchParams.town = t.findCodeById(t.areaData,value[3]).name
      }
    },
    handleChange(value) {
      console.log(`selected ${value}`);
      this.getUserList()
    },
    onSelectChange(selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys;
    },
  }
}
</script>