修改

zhouwx

2025-05-19 457f9c817adef8b003ee6379f493798bae5cbb69

 src/views/Admin/userManage.vue

@@ -1,16 +1,17 @@
<template>
  <div class="inner">
    <a-row type="flex" justify="space-between" style="margin-bottom: 20px">
      <a-col :span="4">
      <a-col :span="6">
        <a-button type="primary" @click="editData('add',{})">新增用户</a-button>
        <a-button type="primary" @click="showDialog = true" style="margin-left: 12px">导入用户表</a-button>
      </a-col>
      <a-col :span="20">
      <a-col :span="18">
        <a-row type="flex" justify="end" :gutter="12">
          <a-col :span="4">
            <a-cascader :options="areaData" v-model="areaVal" placeholder="行政规划" expandTrigger="hover" changeOnSelect @change="onChange" style="width: 100%"/>
            <a-cascader :options="areaData" v-model="areaVal" placeholder="行政规划" expandTrigger="hover" :fieldNames="fieldNames" changeOnSelect @change="onChange" style="width: 100%"/>
          </a-col>
          <a-col :span="4">
            <a-select v-model="search.searchParams.unittype" placeholder="监管层级" style="width: 100%">
            <a-select v-model="search.searchParams.unittype" placeholder="监管层级" style="width: 100%" clearable>
              <a-select-option :value="1">
                省级
              </a-select-option>
@@ -28,7 +29,7 @@
          <a-col :span="4">
            <a-input v-model="search.searchParams.realName" placeholder="姓名" style="width: 100%"/>
          </a-col>
          <a-col :span="4">
          <a-col :span="6">
            <a-button type="primary" @click="getUserList">查询</a-button>
            <a-button style="margin-left: 12px" @click="resetSearch">重置</a-button>
          </a-col>
@@ -38,38 +39,67 @@
    <div class="table-cont">
      <a-table :columns="columns" :data-source="tableData" :pagination="pagination" :rowKey="record=>record.id" bordered>
        <template #sex="sex">
          {{ sex == 0?'男':'女' }}
          {{ sex == 1?'男':'女'}}
        </template>
        <template #level="level">
        <template #unittype="unittype">
          <a-tag
              :key="level"
              :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 #role="role">
          {{ role == 1?'领导':'工作人员'}}
          {{ role.roleName}}
        </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>
          <a-button type="link" @click="editPwd(row)">重置密码</a-button>
        </template>
      </a-table>
<!--      <a-pagination-->
<!--          :total="85"-->
<!--          :show-total="total => `Total ${total} items`"-->
<!--          :page-size="20"-->
<!--          :default-current="1"-->
<!--      />-->
    </div>
    <user-mod ref="userMod" @refrech="getUserList"></user-mod>
    <pwd-mod ref="pwdMod" @refrech="getUserList"></pwd-mod>
    <user-mod ref="userMod" :unitType="unittype" @refresh="getUserList"></user-mod>
    <pwd-mod ref="pwdMod" @refresh="getUserList"></pwd-mod>
    <a-modal v-model="showDialog" title="导入用户" ok-text="导入用户" :confirmLoading="uploadLoading" cancel-text="取消" @ok="uploadFile" centered :afterClose="clearMod">
      <a-form-model ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol" :colon="false">
        <a-form-model-item label="用户表格模板" extra="导入用户须依据此模板">
          <a-button type="primary" @click="downloadFile">下载模板</a-button>
        </a-form-model-item>
        <a-form-model-item label="区划对照表">
          <a-button type="primary" @click="downloadAreaFile">下载区划表</a-button>
        </a-form-model-item>
        <a-form-model-item label="用户表格文件">
          <a-upload :file-list="fileList" :remove="handleRemove" :before-upload="beforeUpload" accept=".xlsx,.xls">
            <a-button> <a-icon type="upload"/> 点击上传 </a-button>
          </a-upload>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
  </div>
</template>

<script>
import {getUser} from '@/api/user'
import {getUser, delUser, importFile, downLoadArea, importUserFile} from '@/api/user'
import userMod from "@/views/Admin/components/userMod"
import pwdMod from "@/views/Admin/components/pwdMod";
import {getDistrictInfo, loginOut} from "@/api/login";
import {getUserInfo, Session} from "@/util/storage";
import Cookies from "js-cookie";
import userExampleFile from "@/assets/userExample.xlsx";
import exampleFile from "@/assets/example.xlsx";
import axios from "axios";
export default {
  name: 'user',
  components: {
@@ -79,13 +109,14 @@
  data () {
    return {
      areaVal: [],
      unittype: null,
      search:{
        pageIndex: 1,
        pageSize: 10,
        searchParams:{
          realName: '',
          districtId: null,
          unittype: undefined
          unittype: null
        }
      },
      columns:[
@@ -96,8 +127,8 @@
        },
        {
          title: '姓名',
          dataIndex: 'name',
          key: 'name'
          dataIndex: 'realName',
          key: 'realName'
        },
        {
          title: '手机号码',
@@ -106,8 +137,8 @@
        },
        {
          title: '用户名',
          dataIndex: 'userName',
          key: 'userName'
          dataIndex: 'name',
          key: 'name'
        },
        {
          title: '性别',
@@ -117,14 +148,14 @@
        },
        {
          title: '级别',
          dataIndex: 'level',
          key: 'level',
          scopedSlots: { customRender: 'level' }
          dataIndex: 'unittype',
          // key: 'unittype',
          scopedSlots: { customRender: 'unittype' }
        },
        {
          title: '行政区划',
          dataIndex: 'area',
          key: 'area',
          // key: 'area',
          scopedSlots: { customRender: 'area' }
        },
        {
@@ -136,94 +167,159 @@
        {
          title: '操作',
          key: 'action',
          width: '18%',
          scopedSlots: { customRender: 'action' },
        },
      ],
      tableData: [
        {
          id: 1,
          name: 'John Brown',
          phone: '15261806177',
          userName: 'JBrown',
          sex: 0,
          level: 1,
          area: 111,
          role: 1
        },
        {
          id: 2,
          name: 'Jim Green',
          phone: '15261806178',
          userName: 'JGreen',
          sex: 1,
          level: 2,
          area: 211,
          role: 2
        },
        {
          id: 3,
          name: 'Joe Black',
          phone: '15261806176',
          userName: 'JBlack',
          sex: 0,
          level: 3,
          area: 11,
          role: 1
        },
      ],
      tableData: [],
      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'
      },
      userExampleFile,
      labelCol: { span: 8 },
      wrapperCol: { span: 14 },
      fileList: [],
      delList: [],
      showDialog: false,
      uploadLoading: false,
    }
  },
  created() {
    const t = this
    t.unittype = getUserInfo().unittype
    t.getUserList()
    t.getDistrictInfo()
  },
  methods:{
    async getUserList(){
      const t = this
      const res = await getUser(t.search)
      if(t.search.searchParams.realName == '' && t.search.searchParams.districtId == null && t.search.searchParams.unittype == null){
        const {searchParams,...data} = t.search
        const res = await getUser(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 getUser(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 delData(row){
      const t = this
      this.$confirm({
        title: '提示',
        content: h => <div>是否删除该条用户信息？</div>,
        cancelText: '取消',
        okText: '确认',
        centered: true,
        onOk() {
          delUser(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');
        },
      });
    },

    handleRemove(file) {
      const index = this.fileList.indexOf(file)
      const newFileList = this.fileList.slice()
      newFileList.splice(index, 1)
      this.fileList = newFileList;
    },
    beforeUpload(file) {
      this.fileList = [...this.fileList, file]
      this.fileList = this.fileList.slice(-1)
      return false;
    },

    async uploadFile(){
      if(this.fileList.length == 0){
        this.$message.warning('请先上传用户表格');
        return
      }else{
        this.uploadLoading = true
        const { fileList } = this;
        const formData = new FormData();
        fileList.forEach((file) => {
          formData.append('file', file)
        })
        const res = await importUserFile(formData)
        if(res.data.code == 100){
          this.$message.success(res.data.msg,2);
          this.fileList = []
          this.uploadLoading = false
          this.showDialog = false
          this.getUserList()
        }else{
          this.$message.warning(res.data.msg);
          this.uploadLoading = false
        }
      }
    },

    downloadFile(){
      const link = document.createElement('a')
      link.href = userExampleFile
      link.target = '_blank'
      link.download = '用户导入模版(普通员工版).xlsx'
      link.click()
    },
    async downloadAreaFile(){
      const t = this
      const res = await downLoadArea();
        if (res) {
          const link = document.createElement('a')
          let blob = new Blob([res.data],{type: res.data.type})
          link.style.display = "none";
          link.href = URL.createObjectURL(blob); // 创建URL
          link.setAttribute("download", '区划对照表');
          document.body.appendChild(link);
          link.click();
          document.body.removeChild(link);
        } else {
          this.$message.error('获取文件失败')
        }
    },
    clearMod(){
      this.fileList = []
    },
    resetSearch(){
      const t = this
      t.areaVal = []
@@ -233,7 +329,7 @@
        searchParams:{
          realName: '',
          districtId: null,
          unittype: undefined
          unittype: null
        }
      }
      t.getUserList()
@@ -247,13 +343,16 @@

    editPwd(record){
      const t = this
      t.$refs.pwdMod.form.id = record.id
      t.$refs.pwdMod.form.uid = record.id
      t.$refs.pwdMod.updateType = 2
      t.$refs.pwdMod.visible = true
    },

    onPageChange(page, pageSize) {
      const t= this
      t.pagination.current = page
      t.search.pageIndex = page
      t.getUserList()
    },
    onChange(value) {
      const t = this