From 9bb6d0b9d8078a0311d16a1faefef9c2330f4d29 Mon Sep 17 00:00:00 2001 From: web <candymxq888@outlook.com> Date: 星期五, 20 六月 2025 17:06:27 +0800 Subject: [PATCH] fix:修改项目配置 --- .env.staging | 11 .env.development | 8 src/views/system/user/index.vue | 703 +++++++++++++++++------------------- src/views/login.vue | 4 src/layout/components/Sidebar/Logo.vue | 12 src/views/configuration/warning/index.vue | 264 +++++++++++++ src/api/facility/point.js | 10 .env.production | 2 src/views/screen/index.vue | 2 vite.config.js | 4 src/api/configuration/warning/alarmScheme.js | 69 +++ 11 files changed, 691 insertions(+), 398 deletions(-) diff --git a/.env.development b/.env.development index 7d71278..326886d 100644 --- a/.env.development +++ b/.env.development @@ -1,12 +1,12 @@ # 页面标题 -VITE_APP_TITLE = 后台管理系统 + VITE_APP_TITLE = 丰都气体监测后台管理系统 # 开发环境配置 -VITE_APP_ENV = 'development' + VITE_APP_ENV = 'development' # 图片地址 -VITE_APP_IMG_BASEURL='http://113.250.189.120:8036/upload' + VITE_APP_IMG_BASEURL='http://192.168.0.67:8040/upload' #后端本地 - VITE_APP_PUBLIC_REQUEST_API = 'http://113.250.189.120:8036' + VITE_APP_PUBLIC_REQUEST_API = 'http://192.168.0.67:8040' diff --git a/.env.production b/.env.production index c4b1c6b..8226dbb 100644 --- a/.env.production +++ b/.env.production @@ -1,6 +1,6 @@ # 页面标题 - VITE_APP_TITLE = 后台管理系统 + VITE_APP_TITLE = 丰都气体监测后台管理系统 # 开发环境配置 VITE_APP_ENV = 'production' diff --git a/.env.staging b/.env.staging index e4db3b2..9b25e99 100644 --- a/.env.staging +++ b/.env.staging @@ -1,14 +1,5 @@ -### - # @Author: web candymxq888@outlook.com - # @Date: 2025-06-19 11:35:36 - # @LastEditors: web candymxq888@outlook.com - # @LastEditTime: 2025-06-19 14:51:40 - # @FilePath: \fengdu_gases_web\.env.staging - # @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE -### - # 页面标题 -VITE_APP_TITLE = 后台管理系统 +VITE_APP_TITLE = 丰都气体监测后台管理系统 # 开发环境配置 VITE_APP_ENV = 'staging' diff --git a/src/api/configuration/warning/alarmScheme.js b/src/api/configuration/warning/alarmScheme.js new file mode 100644 index 0000000..985755a --- /dev/null +++ b/src/api/configuration/warning/alarmScheme.js @@ -0,0 +1,69 @@ +/* + * @Author: elkers + * @Date: 2024-08-09 14:29:49 + * @LastEditors: hqs elkers@163.com + * @LastEditTime: 2024-08-10 08:57:04 + * @FilePath: \water-qinghe-web\src\api\alarmApi\alarmHistory.js + * @Description: 历史记录api + */ +import { publicRequest } from '@/utils/request' +export default function alarmSchemeApi() { + return { + create: (data) => { + return publicRequest({ + url: '/alarmScheme/create', + method: 'post', + data, + }); + }, + modify: (data) => { + return publicRequest({ + url: '/alarmScheme/modify', + method: 'post', + data, + }); + }, + remove: (data) => { + return publicRequest({ + url: `/alarmScheme/remove?id=${data}`, + method: 'post', + data, + }); + }, + stop: (data) => { + return publicRequest({ + url: `/alarmScheme/stop?id=${data}`, + method: 'post', + data, + }); + }, + enable: (data) => { + return publicRequest({ + url: `/alarmScheme/enable?id=${data}`, + method: 'post', + data, + }); + }, + search: (data) => { + return publicRequest({ + url: '/alarmScheme/search', + method: 'post', + data, + }); + }, + get: (data) => { + return publicRequest({ + url: `/alarmScheme/get?id=${data}`, + method: 'get', + data, + }); + }, + setSort: (data) => { + return publicRequest({ + url: `/alarmScheme/setSort`, + method: 'post', + data, + }); + } + }; +} diff --git a/src/api/facility/point.js b/src/api/facility/point.js index ffc596c..c8eff1a 100644 --- a/src/api/facility/point.js +++ b/src/api/facility/point.js @@ -1,8 +1,8 @@ /* * @Author: elkers * @Date: 2024-08-09 14:29:49 - * @LastEditors: hqs elkers@163.com - * @LastEditTime: 2024-08-14 09:33:32 + * @LastEditors: web candymxq888@outlook.com + * @LastEditTime: 2025-06-20 14:01:16 * @FilePath: \water-qinghe-web\src\api\facility\point.js * @Description: 监控点api */ @@ -36,5 +36,11 @@ data }); }, + getParentPoint: () => { + return publicRequest({ + url: 'waterMonitoryPoint/getListTree', + method: 'get', + }) + } }; } diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue index 1490ff8..1d536c6 100644 --- a/src/layout/components/Sidebar/Logo.vue +++ b/src/layout/components/Sidebar/Logo.vue @@ -1,12 +1,3 @@ -<!-- - * @Author: hqs elkers@163.com - * @Date: 2024-05-16 11:24:17 - * @LastEditors: hqs elkers@163.com - * @LastEditTime: 2024-05-17 18:41:06 - * @FilePath: \wisdom-water-factory-web\src\layout\components\Sidebar\Logo.vue - * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE - <div class="sidebar-logo-container" :class="{ 'collapse': collapse }" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"> ---> <template> <div class="sidebar-logo-container" :class="{ 'collapse': collapse }"> <transition name="sidebarLogoFade"> @@ -70,14 +61,15 @@ } & .sidebar-title { + width: calc(100% - 60px); display: inline-block; margin: 0; color: #fff; font-weight: 600; - line-height: 50px; font-size: 14px; font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif; vertical-align: middle; + white-space: pre-wrap; } } diff --git a/src/views/configuration/warning/index.vue b/src/views/configuration/warning/index.vue new file mode 100644 index 0000000..640b144 --- /dev/null +++ b/src/views/configuration/warning/index.vue @@ -0,0 +1,264 @@ +<template> + <div class="app-container"> + <el-form :model="queryParams" ref="queryRef" :inline="true"> + <el-form-item prop="name"> + <el-input + v-model="queryParams.name" + placeholder="请输入内容" + clearable + style="width: 200px" + @keyup.enter="handleQuery" + /> + </el-form-item> + <el-form-item> + <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> + <el-button icon="Refresh" @click="resetQuery">重置</el-button> + </el-form-item> + </el-form> + + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button + type="primary" + plain + icon="Plus" + @click="handleAdd" + >新增</el-button> + </el-col> + </el-row> + <!--表格及分页--> + <el-table v-loading="loading" :data="tableData"> + <el-table-column + v-for="(item, key, index) of tableHeader" + :prop="key.toString()" + :label="item" + :key="index" + align="center" + > + </el-table-column> + <el-table-column label="操作" width="auto" align="center" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button> + </template> + </el-table-column> + </el-table> + <pagination + :total="pageParam.total" + v-model:page="pageParam.page" + v-model:limit="pageParam.limit" + :page-sizes="[10,20,30]" + @pagination="getList" + /> + <!-- 添加或修改对话框 --> + <el-dialog :title="title" v-model="open" append-to-body center> + <el-form class="form-box" ref="formRef" :model="form" :rules="rules" label-width='auto'> + <el-form-item label="选择设备" prop="facilityId"> + <el-select v-model="form.facilityId" placeholder="请选择设备" @change="getFacityCodeList"> + <el-option + v-for="(item,index) in facityList" + :label="item.facilityName" + :value="item.id" + :key="index" + ></el-option> + </el-select> + </el-form-item> + <el-form-item label="设备参数" prop="columnsCode"> + <el-select v-model="form.columnsCode" placeholder="请选择设备参数"> + <el-option + v-for="(item,index) in facityCodeList" + :label="item.columnsShow" + :value="item.columnsCode" + :key="index" + ></el-option> + </el-select> + </el-form-item> + <el-form-item label="方案名称" prop="schemeName"> + <el-input v-model="form.schemeName" placeholder="请输入方案名称" /> + </el-form-item> + <el-form-item label="低报警值" prop="lowAlarm"> + <el-input v-model="form.lowAlarm" placeholder="请输入低报警值" /> + </el-form-item> + <el-form-item label="高报警值" prop="tallAlarm"> + <el-input v-model="form.tallAlarm" placeholder="请输入高报警值" /> + </el-form-item> + <el-form-item label="备注" prop="remark"> + <el-input v-model="form.remark" placeholder="请输入备注" /> + </el-form-item> + </el-form> + <template #footer> + <div class="dialog-footer"> + <el-button type="primary" @click="submitForm">确 定</el-button> + <el-button @click="cancel">取 消</el-button> + </div> + </template> + </el-dialog> + </div> +</template> + +<script setup name="Menu"> +import facilityApi from '@/api/facility/index.js' +import waterFacilityParameter from '@/api/facility/parameter.js' +import alarmSchemeApi from '@/api/configuration/warning/alarmScheme.js' +import setPostParams from "@/utils/searchParams.js"; +import {onMounted} from "vue"; +const { proxy } = getCurrentInstance(); + + +const pageParam = ref({ + total:0, + limit:0, + page:0, +}) +const tableData = ref([]); +let tableHeader = ref({ + schemeName: '方案名称', + facilityName: '设备名称', + columnsName: '参数名称', + lowAlarm: '低报警值', + tallAlarm: '高报警值', + remark: '备注', + createTimeView: '创建时间', +}) + +const open = ref(false); +const loading = ref(false); +const title = ref(""); + +const data = reactive({ + form:{}, + queryParams: { + name: undefined, + }, + rules: { + facilityId: [{ required: true, message: "请选择设备", trigger: "blur" }], + columnsCode: [{ required: true, message: "请选择设备参数", trigger: "blur" }], + schemeName: [{ required: true, message: "请输入方案名称", trigger: "blur" }], + lowAlarm: [{ required: true, message: "请输入低报警值", trigger: "blur" }], + tallAlarm: [{ required: true, message: "请输入高报警值", trigger: "blur" }], + remark: [{ required: false, message: "请输入备注信息", trigger: "blur" }], + }, +}); +const { queryParams, form, rules } = toRefs(data); +const facityList = ref([]); //设备列表 +const facityCodeList = ref([]); //设备参数列表 + +/** + * 搜索相关 + */ +/** 搜索按钮操作 */ +function handleQuery() { + getList({keywords:queryParams.value.name,page:1}) +} + +/** 重置按钮操作 */ +function resetQuery() { + proxy.resetForm("queryRef"); + handleQuery(); +} + +/** 获取列表 */ +async function getList(val) { + loading.value = true; + let postParam = setPostParams(val) + await alarmSchemeApi().search(postParam).then((res) =>{ + tableData.value = res.data.list + pageParam.value.total = res.data.total + pageParam.value.limit = res.data.limit + pageParam.value.page = res.data.page + }) + loading.value = false; +} + +// 获取设备 +const getFacityList = () => { + let postParam = setPostParams() + facilityApi().search(postParam).then(res => { + facityList.value = res.data.list + }) +} + +// 获取设备参数 +const getFacityCodeList = (id) => { + const code = id ? id : form.value.facilityId + waterFacilityParameter().getParam(code).then(res => { + facityCodeList.value = res.data + }) +} + +/** 新增按钮操作 */ +async function handleAdd() { + reset(); + open.value = true; + title.value = "新增方案配置"; +} +/** 修改按钮操作 */ +async function handleUpdate(row) { + reset(); + getFacityCodeList(row.facilityId) + form.value = Object.assign({},row) + open.value = true; + title.value = "修改方案配置"; +} +/** 删除按钮操作 */ +function handleDelete(row) { + proxy.$modal.confirm('是否确认删除名称为"' + row.name + '"的数据项?').then(function() { + return alarmSchemeApi().remove(row.id); + }).then(() => { + getList(); + proxy.$modal.msgSuccess("删除成功"); + }).catch(() => {}); +} + +/** 提交按钮 */ +async function submitForm() { + proxy.$refs["formRef"].validate( async valid => { + if (valid) { + form.value.lowAlarm = Number(form.value.lowAlarm) + form.value.tallAlarm = Number(form.value.tallAlarm) + if (form.value.id != undefined) { + await alarmSchemeApi().modify(form.value).then(res => { + proxy.$modal.msgSuccess("修改成功"); + open.value = false; + getList(); + }).catch(() =>{ + open.value = false; + proxy.$modal.msgError("修改失败"); + }); + } else { + await alarmSchemeApi().create(form.value).then(res => { + proxy.$modal.msgSuccess("新增成功"); + open.value = false; + getList(); + }).catch(() =>{ + open.value = false; + proxy.$modal.msgError("新增失败"); + }); + } + } + }); +} + +/** 取消按钮 */ +function cancel() { + open.value = false; + reset(); +} +/** 表单重置 */ +function reset() { + form.value = { + facilityId:'', + columnsCode:'', + schemeName:'', + lowAlarm:'', + tallAlarm:'', + remark:'', + }; + proxy.resetForm("formRef"); +} + +onMounted(() => { + getList(); + getFacityList() +}) +</script> diff --git a/src/views/login.vue b/src/views/login.vue index 603f261..c56ff05 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -4,7 +4,7 @@ <div class="contain"> <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form" @keydown.enter="handleLogin"> - <h3 class="title">金川水电站生态流量监测系统</h3> + <h3 class="title">{{ title }}</h3> <el-form-item label="账号" prop="userName"> <el-input style="height: 45px;" @@ -80,6 +80,8 @@ import {useRouter, useRoute} from 'vue-router'; import {login, register, getIp} from '@/api/login'; +const title = import.meta.env.VITE_APP_TITLE; + const userStore = useUserStore() const permissionStore = usePermissionStore() const route = useRoute(); diff --git a/src/views/screen/index.vue b/src/views/screen/index.vue index 659e0dd..35ae653 100644 --- a/src/views/screen/index.vue +++ b/src/views/screen/index.vue @@ -8,7 +8,7 @@ <script setup> - +import { ref } from 'vue' </script> diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue index 259ecd2..048eb7e 100644 --- a/src/views/system/user/index.vue +++ b/src/views/system/user/index.vue @@ -1,381 +1,350 @@ - <!-- - * @Author: Liuyi candymxq888@outlook.com - * @Date: 2024-08-06 16:17:39 - * @LastEditors: Liuyi candymxq888@outlook.com - * @LastEditTime: 2024-10-23 15:51:47 - * @FilePath: \water-qinghe-web\src\views\system\user\index.vue - * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE - --> <template> - <div class="app-container"> - <el-form :model="queryParams" ref="queryRef" :inline="true"> - <el-form-item label="用户名称" prop="name"> - <el-input - v-model="queryParams.name" - placeholder="请输入用户名称" - clearable - style="width: 200px" - @keyup.enter="handleQuery" - /> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> - <el-button icon="Refresh" @click="resetQuery">重置</el-button> - </el-form-item> + <div class="app-container"> + <el-form :model="queryParams" ref="queryRef" :inline="true"> + <el-form-item label="用户名称" prop="name"> + <el-input v-model="queryParams.name" placeholder="请输入用户名称" clearable style="width: 200px" + @keyup.enter="handleQuery" /> + </el-form-item> + <el-form-item> + <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> + <el-button icon="Refresh" @click="resetQuery">重置</el-button> + </el-form-item> + </el-form> + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button> + </el-col> + </el-row> + <!--表格及分页--> + <el-table v-loading="loading" :data="tableData"> + <el-table-column v-for="(item, key, index) of tableHeader" :prop="key.toString()" :label="item" :key="index" + align="center"> + <template #default="scope"> + <div v-if="key === 'userType'"> + {{userTypeList?.filter(fil => fil.dictValue == scope.row.userType.toString())?.[0]?.dictLabel}} + </div> + </template> + </el-table-column> + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button> + <el-button v-if="scope.row.userType == 3" link type="primary" icon="Edit" + @click="handleRole(scope.row)">绑定角色</el-button> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button> + </template> + </el-table-column> + </el-table> + <pagination :total="pageParam.total" v-model:page="pageParam.page" v-model:limit="pageParam.limit" + :page-sizes="[10, 20, 30]" @pagination="getList" /> + <!-- 添加或修改对话框 --> + <el-dialog :title="title" v-model="open" append-to-body center> + <el-form class="form-box" ref="userRef" :model="form" :rules="rules"> + <el-form-item label="用户名" prop="userName"> + <el-input :disabled="!!form.id" v-model="form.userName" placeholder="请输入用户名称" /> + </el-form-item> + <el-form-item v-if="!form.id" label="密码" prop="password"> + <el-input v-model="form.password" placeholder="请输入密码" /> + </el-form-item> + <el-form-item label="昵称" prop="nickName"> + <el-input v-model="form.nickName" placeholder="请输入昵称" /> + </el-form-item> + <el-form-item label="用户类型" prop="userType"> + <el-select v-model="form.userType" placeholder="请选择用户类型"> + <el-option v-for="(item, index) in userTypeList" :label="item.dictLabel" :value="item.dictValue" + :key="index"></el-option> + </el-select> + </el-form-item> + <el-form-item label="联系邮箱" prop="email"> + <el-input v-model="form.email" placeholder="请输入邮箱地址" /> + </el-form-item> + <el-form-item label="联系方式" prop="contact"> + <el-input v-model="form.contact" placeholder="请输入联系方式" /> + </el-form-item> + <el-form-item v-if="!form.id"> + <br> + </el-form-item> + <el-form-item label="上传头像" prop=""> + <upload-icons @uploadData="uploadData" :imageList="form.headImg" :limit="1"></upload-icons> + </el-form-item> + <el-form-item></el-form-item> </el-form> - <el-row :gutter="10" class="mb8"> - <el-col :span="1.5"> - <el-button - type="primary" - plain - icon="Plus" - @click="handleAdd" - >新增</el-button> - </el-col> - </el-row> - <!--表格及分页--> - <el-table v-loading="loading" :data="tableData"> - <el-table-column - v-for="(item, key, index) of tableHeader" - :prop="key.toString()" - :label="item" - :key="index" - align="center" - > - <template #default="scope"> - <div v-if="key === 'userType'"> - {{userTypeList?.filter(fil => fil.dictValue == scope.row.userType.toString())[0].dictLabel}} - </div> - </template> - </el-table-column> - <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> - <template #default="scope"> - <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button> - <el-button v-if="scope.row.userType == 3" link type="primary" icon="Edit" @click="handleRole(scope.row)">绑定角色</el-button> - <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button> - </template> - </el-table-column> - </el-table> - <pagination - :total="pageParam.total" - v-model:page="pageParam.page" - v-model:limit="pageParam.limit" - :page-sizes="[10,20,30]" - @pagination="getList" - /> - <!-- 添加或修改对话框 --> - <el-dialog :title="title" v-model="open" append-to-body center> - <el-form class="form-box" ref="userRef" :model="form" :rules="rules"> - <el-form-item label="用户名" prop="userName"> - <el-input :disabled ="!!form.id" v-model="form.userName" placeholder="请输入用户名称"/> - </el-form-item> - <el-form-item v-if="!form.id" label="密码" prop="password"> - <el-input v-model="form.password" placeholder="请输入密码" /> - </el-form-item> - <el-form-item label="昵称" prop="nickName"> - <el-input v-model="form.nickName" placeholder="请输入昵称" /> - </el-form-item> - <el-form-item label="用户类型" prop="userType"> - <el-select v-model="form.userType" placeholder="请选择用户类型"> - <el-option - v-for="(item,index) in userTypeList" - :label="item.dictLabel" - :value="item.dictValue" - :key="index" - ></el-option> - </el-select> - </el-form-item> - <el-form-item label="联系邮箱" prop="email"> - <el-input v-model="form.email" placeholder="请输入邮箱地址" /> - </el-form-item> - <el-form-item label="联系方式" prop="contact"> - <el-input v-model="form.contact" placeholder="请输入联系方式" /> - </el-form-item> - <el-form-item v-if="!form.id"> - <br> - </el-form-item> - <el-form-item label="上传头像" prop=""> - <upload-icons @uploadData="uploadData" :imageList="form.headImg" :limit="1"></upload-icons> - </el-form-item> - <el-form-item></el-form-item> - </el-form> - <template #footer> - <div class="dialog-footer"> - <el-button type="primary" @click="submitForm">确 定</el-button> - <el-button @click="cancel">取 消</el-button> - </div> - </template> - </el-dialog> - - <!-- 角色设置弹窗 --> - <el-dialog - v-model="open1" - title="角色绑定" - align-center - center - width="300" - > - <div class="bandCheck"> - <el-checkbox-group v-model="roleCheckedList"> - <el-checkbox v-for="(item,index) in roleSelectList" :key="index" :label="item.name" :value="item.id" size ="large" /> - </el-checkbox-group> - </div> - <div class="handleBtn"> - <el-button @click="open1 = false">取消</el-button> - <el-button type="primary" @click="bandListConfirm">确认</el-button> - </div> - </el-dialog> - </div> + <template #footer> + <div class="dialog-footer"> + <el-button type="primary" @click="submitForm">确 定</el-button> + <el-button @click="cancel">取 消</el-button> + </div> + </template> + </el-dialog> + + <!-- 角色设置弹窗 --> + <el-dialog v-model="open1" title="角色绑定" align-center center width="300"> + <div class="bandCheck"> + <el-checkbox-group v-model="roleCheckedList"> + <el-checkbox v-for="(item, index) in roleSelectList" :key="index" :label="item.name" :value="item.id" + size="large" /> + </el-checkbox-group> + </div> + <div class="handleBtn"> + <el-button @click="open1 = false">取消</el-button> + <el-button type="primary" @click="bandListConfirm">确认</el-button> + </div> + </el-dialog> + </div> </template> - - <script setup> - import user from "@/api/system/user"; - import role from "@/api/system/role"; - import { sysDictData } from "@/api/system/dict"; - import setPostParams from "@/utils/searchParams.js"; - const { proxy } = getCurrentInstance(); - - /** - * 搜索相关 - */ - /** 搜索按钮操作 */ - function handleQuery() { - getList({keywords:queryParams.value.name,page:1}) - } - - /** 重置按钮操作 */ - function resetQuery() { - proxy.resetForm("queryRef"); - handleQuery(); - } - /** - * Table表格权限数据列表相关 - */ - const pageParam = ref({ - total:0, - limit:0, - page:0, - }) - const tableData = ref([]); - let tableHeader = ref({ - userName: '用户名称', - nickName: '昵称', - userType:'用户类型', - contact:'联系方式', - email:'邮箱地址', - createTimeView:'创建时间' - }) - /** 获取列表 */ - async function getList(val) { - loading.value = true; +<script setup> +import user from "@/api/system/user"; +import role from "@/api/system/role"; +import { sysDictData } from "@/api/system/dict"; +import setPostParams from "@/utils/searchParams.js"; +const { proxy } = getCurrentInstance(); - let postParam = setPostParams(val) - await user().search(postParam).then((res) =>{ - tableData.value = res.data.list - pageParam.value.total = res.data.total - pageParam.value.limit = res.data.limit - pageParam.value.page = res.data.page - }) - loading.value = false; - } - - /** 新增按钮操作 */ - async function handleAdd() { - reset(); - open.value = true; - title.value = "新增用户"; - } - - /** 修改按钮操作 */ - async function handleUpdate(row) { - reset(); - form.value = Object.assign({},row) - open.value = true; - title.value = "修改用户"; - } +/** + * 搜索相关 + */ +/** 搜索按钮操作 */ +function handleQuery() { + getList({ keywords: queryParams.value.name, page: 1 }) +} - /** 删除按钮操作 */ - function handleDelete(row) { - proxy.$modal.confirm('是否确认删除名称为"' + row.nickName + '"的数据项?').then(function() { - return user().remove(row.id); - }).then(() => { - getList(); - proxy.$modal.msgSuccess("删除成功"); - }).catch(() => {}); - } +/** 重置按钮操作 */ +function resetQuery() { + proxy.resetForm("queryRef"); + handleQuery(); +} - /** - * 新增/修改弹窗Form表单相关 - */ - const open = ref(false); - const loading = ref(false); - const title = ref(""); +/** + * Table表格权限数据列表相关 + */ +const pageParam = ref({ + total: 0, + limit: 0, + page: 0, +}) +const tableData = ref([]); +let tableHeader = ref({ + userName: '用户名称', + nickName: '昵称', + userType: '用户类型', + contact: '联系方式', + email: '邮箱地址', + createTimeView: '创建时间' +}) +/** 获取列表 */ +async function getList(val) { + loading.value = true; - const data = reactive({ - form:{}, - queryParams: { - name: undefined, - }, - rules: { - userName: [{ required: true, message: "请输入用户名称", trigger: "blur" }], - password: [{ required: true, message: "请输入密码", trigger: "blur" }], - nickName: [{ required: true, message: "请输入昵称", trigger: "blur" }], - userType: [{ required: true, message: "请选择用户类型", trigger: "blur" }], - contact: [{ required: true, message: "请输入联系方式", trigger: "blur" }], - email: [{ required: true, message: "请输入邮箱地址", trigger: "blur" }], - headImg: [{ required: true, message: "请上传用户头像", trigger: "blur" }], - }, - }); - const { queryParams, form, rules } = toRefs(data); + let postParam = setPostParams(val) + await user().search(postParam).then((res) => { + tableData.value = res.data.list + pageParam.value.total = res.data.total + pageParam.value.limit = res.data.limit + pageParam.value.page = res.data.page + }) + loading.value = false; +} - //上传文件,添加图片地址信息 - const uploadData = (img) => { - form.value.headImg = img.toString() - } +/** 新增按钮操作 */ +async function handleAdd() { + reset(); + open.value = true; + title.value = "新增用户"; +} - //获取用户分类列表 - const userTypeList = ref() - const getUserType = async() =>{ - await sysDictData().searchType('user_type').then((res) =>{ - userTypeList.value = res.data - }) - } - /** 提交按钮 */ - function submitForm() { - proxy.$refs["userRef"].validate(valid => { - if (valid) { - if (form.value.id != undefined) { - user().modify(form.value).then(res => { - proxy.$modal.msgSuccess("修改成功"); - open.value = false; - getList(); - }).catch(() =>{ - open.value = false; - proxy.$modal.msgError("修改失败"); - }); - } else { - user().create(form.value).then(res => { - proxy.$modal.msgSuccess("新增成功"); - open.value = false; - getList(); - }).catch(() =>{ - open.value = false; - proxy.$modal.msgError("新增失败"); - }); - } - } - }); - } +/** 修改按钮操作 */ +async function handleUpdate(row) { + reset(); + form.value = Object.assign({}, row) + open.value = true; + title.value = "修改用户"; +} - /** 取消按钮 */ - function cancel() { - open.value = false; - reset(); - } - - /** 表单重置 */ - function reset() { - form.value = { - userName: '', - nickName: '', - headImg:undefined, - userType:undefined, - contact:'', - email:'', - }; - proxy.resetForm("userRef"); - } - - /** - * 设置角色相关 - */ - - //获取用户角色列表 - const open1 = ref(false) - const roleCheckedList = ref([]) - const roleSelectList = ref() - - //获取用户角色列表 - const getUserRole = async() =>{ - await role().search({limit:100,page:1}).then((res) =>{ - roleSelectList.value = res.data.list - }) - } - //绑定按钮 - const userId = ref() - async function handleRole(row){ - open1.value = true - userId.value = row.id - await getUserRole() - await getBandedRoleList(userId.value) - } - //获取已绑定角色列表 - async function getBandedRoleList(id){ - await user().getListRoleAdmin(id).then((res) =>{ - if(res.code == 200){ - let list = [] - res.data.forEach((item) =>{ - list.push(item.id) - }) - roleCheckedList.value = list - console.log(123,res) - } - }) - } - //绑定请求 - async function bandListConfirm(){ - let postParam = { - id:userId.value, - listRole:roleCheckedList.value - } - // console.log('roleCheckedList',roleCheckedList.value,id) - await user().setListRoleAdmin(postParam).then((res) =>{ - if(res.code == 200){ - proxy.$modal.msgSuccess("绑定成功"); - open1.value = false; - } - }) - } - getUserType() +/** 删除按钮操作 */ +function handleDelete(row) { + proxy.$modal.confirm('是否确认删除名称为"' + row.nickName + '"的数据项?').then(function () { + return user().remove(row.id); + }).then(() => { getList(); - </script> - <style lang="scss" scoped> - .table-headImg{ - max-width: 100px; - height: 50px; - } - .el-dialog{ - width:50vw; - .user-form{ - display: flex; - flex-wrap: wrap; - justify-content:flex-start; - align-items: center; - margin: 20px auto; - width: 90%; - .el-form-item{ - width: 45%; - } - } - } - .bandCheck{ - width:100%; - /* background-color: beige; */ - display: flex; - justify-content: center; - align-items: center; - margin-bottom:100px; - } - .handleBtn{ - width:100%; - /* background-color: beige; */ - display: flex; - justify-content: center; - align-items: center; - .el-button{ - width:100px; + proxy.$modal.msgSuccess("删除成功"); + }).catch(() => { }); +} + +/** + * 新增/修改弹窗Form表单相关 + */ +const open = ref(false); +const loading = ref(false); +const title = ref(""); + +const data = reactive({ + form: {}, + queryParams: { + name: undefined, + }, + rules: { + userName: [{ required: true, message: "请输入用户名称", trigger: "blur" }], + password: [{ required: true, message: "请输入密码", trigger: "blur" }], + nickName: [{ required: true, message: "请输入昵称", trigger: "blur" }], + userType: [{ required: true, message: "请选择用户类型", trigger: "blur" }], + contact: [{ required: true, message: "请输入联系方式", trigger: "blur" }], + email: [{ required: true, message: "请输入邮箱地址", trigger: "blur" }], + headImg: [{ required: true, message: "请上传用户头像", trigger: "blur" }], + }, +}); +const { queryParams, form, rules } = toRefs(data); + +//上传文件,添加图片地址信息 +const uploadData = (img) => { + form.value.headImg = img.toString() +} + +//获取用户分类列表 +const userTypeList = ref() +const getUserType = async () => { + await sysDictData().searchType('user_type').then((res) => { + userTypeList.value = res.data + }) +} +/** 提交按钮 */ +function submitForm() { + proxy.$refs["userRef"].validate(valid => { + if (valid) { + if (form.value.id != undefined) { + user().modify(form.value).then(res => { + proxy.$modal.msgSuccess("修改成功"); + open.value = false; + getList(); + }).catch(() => { + open.value = false; + proxy.$modal.msgError("修改失败"); + }); + } else { + user().create(form.value).then(res => { + proxy.$modal.msgSuccess("新增成功"); + open.value = false; + getList(); + }).catch(() => { + open.value = false; + proxy.$modal.msgError("新增失败"); + }); } } - </style> - \ No newline at end of file + }); +} + +/** 取消按钮 */ +function cancel() { + open.value = false; + reset(); +} + +/** 表单重置 */ +function reset() { + form.value = { + userName: '', + nickName: '', + headImg: undefined, + userType: undefined, + contact: '', + email: '', + }; + proxy.resetForm("userRef"); +} + +/** + * 设置角色相关 + */ + +//获取用户角色列表 +const open1 = ref(false) +const roleCheckedList = ref([]) +const roleSelectList = ref() + +//获取用户角色列表 +const getUserRole = async () => { + await role().search({ limit: 100, page: 1 }).then((res) => { + roleSelectList.value = res.data.list + }) +} +//绑定按钮 +const userId = ref() +async function handleRole(row) { + open1.value = true + userId.value = row.id + await getUserRole() + await getBandedRoleList(userId.value) +} +//获取已绑定角色列表 +async function getBandedRoleList(id) { + await user().getListRoleAdmin(id).then((res) => { + if (res.code == 200) { + let list = [] + res.data.forEach((item) => { + list.push(item.id) + }) + roleCheckedList.value = list + console.log(123, res) + } + }) +} +//绑定请求 +async function bandListConfirm() { + let postParam = { + id: userId.value, + listRole: roleCheckedList.value + } + // console.log('roleCheckedList',roleCheckedList.value,id) + await user().setListRoleAdmin(postParam).then((res) => { + if (res.code == 200) { + proxy.$modal.msgSuccess("绑定成功"); + open1.value = false; + } + }) +} +getUserType() +getList(); +</script> +<style lang="scss" scoped> +.table-headImg { + max-width: 100px; + height: 50px; +} + +.el-dialog { + width: 50vw; + + .user-form { + display: flex; + flex-wrap: wrap; + justify-content: flex-start; + align-items: center; + margin: 20px auto; + width: 90%; + + .el-form-item { + width: 45%; + } + } +} + +.bandCheck { + width: 100%; + /* background-color: beige; */ + display: flex; + justify-content: center; + align-items: center; + margin-bottom: 100px; +} + +.handleBtn { + width: 100%; + /* background-color: beige; */ + display: flex; + justify-content: center; + align-items: center; + + .el-button { + width: 100px; + } +} +</style> diff --git a/vite.config.js b/vite.config.js index 7d66f27..a057bfd 100644 --- a/vite.config.js +++ b/vite.config.js @@ -25,12 +25,12 @@ }, // vite 相关配置 server: { - port: 5036, + port: 6036, host: true, open: true, // proxy: { // '/api': { - // target: 'http://192.168.0.200:8036', + // target: 'http://192.168.0.67:8040', // changeOrigin: true, // rewrite: (p) => p.replace(/^\/api/, '') // } -- Gitblit v1.9.3