zhouwx
2024-06-14 137910cf4fc73a3a2787a3a02718f1e1f637c368
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<template>
    <div class="app-container">
        <div style="margin-bottom: 10px">
            <el-button
                type="primary"
                plain
                icon="Plus"
                @click="openDialog('add',{})"
            >新增</el-button>
        </div>
        <!-- 表格数据 -->
        <el-table v-loading="loading" :data="dataList" :border="true">
            <el-table-column label="姓名" prop="name" align="center"  />
            <el-table-column label="手机号" prop="phone" align="center" />
            <el-table-column label="用户名" prop="username" align="center"  />
            <el-table-column label="账号类型" prop="userType" align="center" >
                <template #default="scope">
                    {{scope.row.userType == 0?'工作人员':scope.row.userType == 1?'领导':'其他'}}
                </template>
            </el-table-column>
            <el-table-column label="监管地区" prop="manageRegion" align="center"/>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
                <template #default="scope">
                    <el-button link type="primary" @click="openDialog('edit',scope.row)">编辑</el-button>
                    <el-button link type="danger" @click="handleDelete(scope.row)">删除</el-button>
                    <el-button link type="primary" @click="openDialog('pwd',scope.row)">修改密码</el-button>
                </template>
            </el-table-column>
        </el-table>
 
        <pagination
            v-show="total > 0"
            :total="total"
            v-model:page="queryParams.pageNum"
            v-model:limit="queryParams.pageSize"
            @pagination="getList"
        />
        <supervise-dialog ref="superRef" @getList=getList></supervise-dialog>
    </div>
</template>
 
<script setup>
import {getCurrentInstance, onMounted, onUnmounted, reactive, ref, toRefs} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import superviseDialog from "./components/superviseDialog.vue"
import { getMonitorList, delMonitor } from "../../../../api/sysUsers"
 
const { proxy } = getCurrentInstance();
const loading = ref(false);
const superRef = ref();
const data = reactive({
    queryParams: {
        pageNum: 1,
        pageSize: 10,
    },
    total: 0,
    dataList: []
});
 
const { queryParams, total, dataList } = toRefs(data);
 
onMounted(()=>{
  getList()
})
 
onUnmounted(()=>{
 
})
 
const getList = async () => {
    loading.value = true
    const res = await getMonitorList(data.queryParams)
    if(res.code == 200){
      data.dataList = res.data.list
      data.total = res.data.total
    }else{
      ElMessage.warning(res.message)
    }
    loading.value = false
}
 
const openDialog = (type, value) => {
    superRef.value.openDialog(type, value);
}
 
/** 重置新增的表单以及其他数据  */
function reset() {
    proxy.resetForm("roleRef");
}
const handleDelete = (val) => {
    ElMessageBox.confirm(
        '确定删除此条数据?',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        })
        .then( async() => {
            const res = await delMonitor(val.id)
            if(res.code == 200){
              ElMessage.success('数据删除成功')
              getList()
            }else{
              ElMessage.warning(res.message)
            }
        })
}
 
</script>