From 29ecfd471b311537e5ce388b33e3befb15cb1f1c Mon Sep 17 00:00:00 2001
From: fenda <996584995@qq.com>
Date: Mon, 8 Mar 2021 20:14:29 +0800
Subject: [PATCH] msg
---
dvadmin-ui/.env.development | 2 +-
dvadmin-ui/src/api/permission/msg.js | 70 ++++
dvadmin-ui/src/layout/components/Navbar.vue | 116 ++++---
dvadmin-ui/src/router/index.js | 16 +-
.../src/views/permission/user/msg/index.vue | 317 ++++++++++++++++++
.../src/views/permission/user/users/index.vue | 29 --
6 files changed, 464 insertions(+), 86 deletions(-)
create mode 100644 dvadmin-ui/src/api/permission/msg.js
create mode 100644 dvadmin-ui/src/views/permission/user/msg/index.vue
delete mode 100644 dvadmin-ui/src/views/permission/user/users/index.vue
diff --git a/dvadmin-ui/.env.development b/dvadmin-ui/.env.development
index 50c2ab8..696f51f 100755
--- a/dvadmin-ui/.env.development
+++ b/dvadmin-ui/.env.development
@@ -2,7 +2,7 @@
ENV = 'development'
# 若依管理系统/开发环境
-VUE_APP_BASE_API = 'http://127.0.0.1:8000'
+VUE_APP_BASE_API = 'https://api.django-vue-admin.com/'
# 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true
diff --git a/dvadmin-ui/src/api/permission/msg.js b/dvadmin-ui/src/api/permission/msg.js
new file mode 100644
index 0000000..a403383
--- /dev/null
+++ b/dvadmin-ui/src/api/permission/msg.js
@@ -0,0 +1,70 @@
+/*
+ * @Author: 庄志莹
+ * @Date: 2021-03-08 19:39:35
+ * @LastEditTime: 2021-03-08 20:03:36
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \dvadmin-ui\src\api\permission\msg.js
+ */
+import request from '@/utils/request'
+
+// 查询消息列表
+export function getList(query) {
+ return request({
+ url: '/system/config/',
+ method: 'get',
+ params: query
+ })
+}
+
+// 查看详情
+export function getDesc(configId) {
+ return request({
+ url: '/system/config/' + configId + '/',
+ method: 'get'
+ })
+}
+
+// // 根据消息标题查询
+// export function getConfigKey(configKey) {
+// return request({
+// url: '/system/config/configKey/' + configKey + '/',
+// method: 'get'
+// })
+// }
+
+// 新增消息
+export function addMsg(data) {
+ return request({
+ url: '/system/config/',
+ method: 'post',
+ data: data
+ })
+}
+
+// 修改消息
+export function updateMsg(data) {
+ return request({
+ url: '/system/config/' + data.id + '/',
+ method: 'put',
+ data: data
+ })
+}
+
+// 删除消息
+export function delMsg(configId) {
+ return request({
+ url: '/system/config/' + configId + '/',
+ method: 'delete'
+ })
+}
+
+
+// 导出消息
+export function exportMsg(query) {
+ return request({
+ url: '/system/config/export/',
+ method: 'get',
+ params: query
+ })
+}
diff --git a/dvadmin-ui/src/layout/components/Navbar.vue b/dvadmin-ui/src/layout/components/Navbar.vue
index b11460a..79ecccc 100755
--- a/dvadmin-ui/src/layout/components/Navbar.vue
+++ b/dvadmin-ui/src/layout/components/Navbar.vue
@@ -1,13 +1,24 @@
<template>
<div class="navbar">
- <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
+ <hamburger
+ id="hamburger-container"
+ :is-active="sidebar.opened"
+ class="hamburger-container"
+ @toggleClick="toggleSideBar"
+ />
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
<div class="right-menu">
- <template v-if="device!=='mobile'">
+ <template v-if="device !== 'mobile'">
+ <router-link to="/user/msg">
+ <el-badge :value="count" :max="99" class="badge-item">
+ <i class="el-icon-message-solid badge-item-icon"></i>
+ </el-badge>
+ </router-link>
+
<search id="header-search" class="right-menu-item" />
-
+
<el-tooltip content="源码地址" effect="dark" placement="bottom">
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
</el-tooltip>
@@ -21,12 +32,14 @@
<el-tooltip content="布局大小" effect="dark" placement="bottom">
<size-select id="size-select" class="right-menu-item hover-effect" />
</el-tooltip>
-
</template>
- <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
+ <el-dropdown
+ class="avatar-container right-menu-item hover-effect"
+ trigger="click"
+ >
<div class="avatar-wrapper">
- <img :src="avatar" class="user-avatar">
+ <img :src="avatar" class="user-avatar" />
<i class="el-icon-caret-bottom" />
</div>
<el-dropdown-menu slot="dropdown">
@@ -46,14 +59,14 @@
</template>
<script>
-import { mapGetters } from 'vuex'
-import Breadcrumb from '@/components/Breadcrumb'
-import Hamburger from '@/components/Hamburger'
-import Screenfull from '@/components/Screenfull'
-import SizeSelect from '@/components/SizeSelect'
-import Search from '@/components/HeaderSearch'
-import RuoYiGit from '@/components/RuoYi/Git'
-import RuoYiDoc from '@/components/RuoYi/Doc'
+import { mapGetters } from "vuex";
+import Breadcrumb from "@/components/Breadcrumb";
+import Hamburger from "@/components/Hamburger";
+import Screenfull from "@/components/Screenfull";
+import SizeSelect from "@/components/SizeSelect";
+import Search from "@/components/HeaderSearch";
+import RuoYiGit from "@/components/RuoYi/Git";
+import RuoYiDoc from "@/components/RuoYi/Doc";
export default {
components: {
@@ -63,43 +76,44 @@ export default {
SizeSelect,
Search,
RuoYiGit,
- RuoYiDoc
+ RuoYiDoc,
+ },
+ data() {
+ return {
+ count: 0,
+ };
},
computed: {
- ...mapGetters([
- 'sidebar',
- 'avatar',
- 'device'
- ]),
+ ...mapGetters(["sidebar", "avatar", "device"]),
setting: {
get() {
- return this.$store.state.settings.showSettings
+ return this.$store.state.settings.showSettings;
},
set(val) {
- this.$store.dispatch('settings/changeSetting', {
- key: 'showSettings',
- value: val
- })
- }
- }
+ this.$store.dispatch("settings/changeSetting", {
+ key: "showSettings",
+ value: val,
+ });
+ },
+ },
},
methods: {
toggleSideBar() {
- this.$store.dispatch('app/toggleSideBar')
+ this.$store.dispatch("app/toggleSideBar");
},
async logout() {
- this.$confirm('确定注销并退出系统吗？', '提示', {
- confirmButtonText: '确定',
- cancelButtonText: '取消',
- type: 'warning'
+ this.$confirm("确定注销并退出系统吗？", "提示", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning",
}).then(() => {
- this.$store.dispatch('LogOut').then(() => {
- location.href = '/index';
- })
- })
- }
- }
-}
+ this.$store.dispatch("LogOut").then(() => {
+ location.href = "/index";
+ });
+ });
+ },
+ },
+};
</script>
<style lang="scss" scoped>
@@ -108,18 +122,18 @@ export default {
overflow: hidden;
position: relative;
background: #fff;
- box-shadow: 0 1px 4px rgba(0,21,41,.08);
+ box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
.hamburger-container {
line-height: 46px;
height: 100%;
float: left;
cursor: pointer;
- transition: background .3s;
- -webkit-tap-highlight-color:transparent;
+ transition: background 0.3s;
+ -webkit-tap-highlight-color: transparent;
&:hover {
- background: rgba(0, 0, 0, .025)
+ background: rgba(0, 0, 0, 0.025);
}
}
@@ -136,6 +150,18 @@ export default {
float: right;
height: 100%;
line-height: 50px;
+ .badge-item {
+ height: 70px;
+ width: 30px;
+ line-height: 40px;
+ text-align: center;
+ margin-right: 5px;
+ .badge-item-icon {
+ width: 18px;
+ color: #5a5e66;
+ height: 18px;
+ }
+ }
&:focus {
outline: none;
@@ -151,10 +177,10 @@ export default {
&.hover-effect {
cursor: pointer;
- transition: background .3s;
+ transition: background 0.3s;
&:hover {
- background: rgba(0, 0, 0, .025)
+ background: rgba(0, 0, 0, 0.025);
}
}
}
diff --git a/dvadmin-ui/src/router/index.js b/dvadmin-ui/src/router/index.js
index d158021..6b4e404 100755
--- a/dvadmin-ui/src/router/index.js
+++ b/dvadmin-ui/src/router/index.js
@@ -77,18 +77,12 @@ export const constantRoutes = [
component: (resolve) => require(['@/views/permission/user/profile/index'], resolve),
name: 'Profile',
meta: { title: '个人中心', icon: 'user' }
- }
- ]
- },
- {
- path: '/user',
- component: Layout,
- children: [
+ },
{
- path: 'users',
- component: (resolve) => require(['@/views/permission/user/users/index'], resolve),
- name: 'Profile',
- meta: { title: '个人测试', icon: 'user' }
+ path: 'msg',
+ component: (resolve) => require(['@/views/permission/user/msg/index'], resolve),
+ name: 'msg',
+ meta: { title: '消息通知', icon: 'user' }
}
]
},
diff --git a/dvadmin-ui/src/views/permission/user/msg/index.vue b/dvadmin-ui/src/views/permission/user/msg/index.vue
new file mode 100644
index 0000000..9975568
--- /dev/null
+++ b/dvadmin-ui/src/views/permission/user/msg/index.vue
@@ -0,0 +1,317 @@
+<template>
+ <div class="app-container">
+ <!-- 搜索表单 -->
+ <el-form
+ :model="queryParams"
+ ref="queryForm"
+ :inline="true"
+ v-show="showSearch"
+ label-width="68px"
+ >
+ <el-form-item label="消息名称" prop="msgTitle">
+ <el-input
+ v-model="queryParams.msgTitle"
+ placeholder="请输入消息名称"
+ clearable
+ size="small"
+ style="width: 240px"
+ @keyup.enter.native="handleQuery"
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"
+ >搜索</el-button
+ >
+ <el-button icon="el-icon-refresh" size="mini" @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="el-icon-plus"
+ size="mini"
+ @click="handleAdd"
+ v-hasPermi="['system:config:post']"
+ >新增</el-button
+ >
+ </el-col>
+ <el-col :span="1.5">
+ <el-button
+ type="danger"
+ plain
+ icon="el-icon-delete"
+ size="mini"
+ :disabled="multiple"
+ @click="handleDelete"
+ v-hasPermi="['system:config:{id}:delete']"
+ >删除</el-button
+ >
+ </el-col>
+ <el-col :span="1.5">
+ <el-button
+ type="warning"
+ plain
+ icon="el-icon-download"
+ size="mini"
+ @click="handleExport"
+ v-hasPermi="['system:config:export:get']"
+ >导出</el-button
+ >
+ </el-col>
+
+ <!-- 右边的隐藏搜索和刷新 -->
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+ </el-row>
+
+ <!-- 表格 -->
+ <el-table
+ v-loading="loading"
+ :data="configList"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column label="消息序号" align="center" prop="id" />
+ <el-table-column
+ label="消息名称"
+ align="center"
+ prop="msgTitle"
+ :show-overflow-tooltip="true"
+ />
+ <el-table-column label="状态" align="center" prop="status" />
+ <el-table-column
+ label="备注"
+ align="center"
+ prop="remark"
+ :show-overflow-tooltip="true"
+ />
+ <el-table-column
+ label="创建时间"
+ align="center"
+ prop="create_datetime"
+ width="180"
+ />
+ <el-table-column
+ label="操作"
+ align="center"
+ class-name="small-padding fixed-width"
+ v-if="hasPermi(['system:config:{id}:put'])"
+ >
+ <template slot-scope="scope">
+ <el-button
+ size="mini"
+ type="text"
+ icon="el-icon-edit"
+ @click="handleUpdate(scope.row)"
+ v-hasPermi="['system:config:{id}:put']"
+ >修改</el-button
+ >
+ <el-button
+ size="mini"
+ type="text"
+ icon="el-icon-more"
+ @click="handleDesc(scope.row)"
+ >详情</el-button
+ >
+ </template>
+ </el-table-column>
+ </el-table>
+
+ <pagination
+ v-show="total > 0"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
+ />
+
+ <!-- 添加或修改参数配置对话框 -->
+ <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+ <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+ <el-form-item label="消息名称" prop="msgTitle">
+ <el-input v-model="form.msgTitle" placeholder="请输入消息名称" />
+ </el-form-item>
+ <el-form-item label="状态" prop="status">
+ <el-radio-group v-model="form.status">
+ <el-radio :key="0" :label="0">正常</el-radio>
+ <el-radio :key="1" :label="1">停用</el-radio>
+ </el-radio-group>
+ </el-form-item>
+ <el-form-item label="备注" prop="remark">
+ <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+ </el-form-item>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="submitForm">确 定</el-button>
+ <el-button @click="cancel">取 消</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import {
+ getList,
+ getDesc,
+ delMsg,
+ addMsg,
+ updateMsg,
+ exportMsg,
+} from "@/api/permission/msg";
+
+export default {
+ name: "Msg",
+ data() {
+ return {
+ // 遮罩层
+ loading: true,
+ // 选中数组
+ ids: [],
+ // 非单个禁用
+ single: true,
+ // 非多个禁用
+ multiple: true,
+ // 显示搜索条件
+ showSearch: true,
+ // 总条数
+ total: 0,
+ // 参数表格数据
+ configList: [],
+ // 弹出层标题
+ title: "",
+ // 是否显示弹出层
+ open: false,
+ // 查询参数
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ msgTitle: undefined,
+ status: undefined,
+ },
+ // 表单参数
+ form: {},
+ // 表单校验
+ rules: {
+ msgTitle: [{ required: true, message: "消息名称不能为空", trigger: "blur" }],
+ },
+ };
+ },
+ created() {
+ this.getList();
+ },
+ methods: {
+ /** 查询参数列表 */
+ getList() {
+ this.loading = true;
+ getList(this.queryParams).then((response) => {
+ this.configList = response.data.results;
+ this.total = response.data.count;
+ this.loading = false;
+ });
+ },
+ // 取消按钮
+ cancel() {
+ this.open = false;
+ this.reset();
+ },
+ // 表单重置
+ reset() {
+ this.form = {
+ id: undefined,
+ msgTitle: undefined,
+ status: "0",
+ remark: undefined,
+ };
+ this.resetForm("form");
+ },
+ /** 搜索按钮操作 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList();
+ },
+ /** 重置按钮操作 */
+ resetQuery() {
+ this.resetForm("queryForm");
+ this.handleQuery();
+ },
+ /** 新增按钮操作 */
+ handleAdd() {
+ this.reset();
+ this.open = true;
+ this.title = "添加消息";
+ },
+ // 多选框选中数据
+ handleSelectionChange(selection) {
+ this.ids = selection.map((item) => item.id);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
+ },
+ /** 修改按钮操作 */
+ handleUpdate(row) {
+ this.reset();
+ const id = row.id || this.ids;
+ getDesc(id).then((response) => {
+ this.form = response.data;
+ this.open = true;
+ this.title = "修改参数";
+ });
+ },
+ //查看详情
+ handleDesc(row) {},
+ /** 提交按钮 */
+ submitForm: function () {
+ this.$refs["form"].validate((valid) => {
+ if (valid) {
+ if (this.form.id != undefined) {
+ updateMsg(this.form).then((response) => {
+ this.msgSuccess("修改成功");
+ this.open = false;
+ this.getList();
+ });
+ } else {
+ addMsg(this.form).then((response) => {
+ this.msgSuccess("新增成功");
+ this.open = false;
+ this.getList();
+ });
+ }
+ }
+ });
+ },
+ /** 删除按钮操作 */
+ handleDelete(row) {
+ const configIds = row.id || this.ids;
+ this.$confirm('是否确认删除参数编号为"' + configIds + '"的数据项?', "警告", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning",
+ })
+ .then(function () {
+ return delMsg(configIds);
+ })
+ .then(() => {
+ this.getList();
+ this.msgSuccess("删除成功");
+ });
+ },
+ /** 导出按钮操作 */
+ handleExport() {
+ const queryParams = this.queryParams;
+ this.$confirm("是否确认导出所有参数数据项?", "警告", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning",
+ })
+ .then(function () {
+ return exportMsg(queryParams);
+ })
+ .then((response) => {
+ this.download(response.data.file_url, response.data.name);
+ });
+ },
+ },
+};
+</script>
diff --git a/dvadmin-ui/src/views/permission/user/users/index.vue b/dvadmin-ui/src/views/permission/user/users/index.vue
deleted file mode 100644
index 047260e..0000000
--- a/dvadmin-ui/src/views/permission/user/users/index.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<template>
- <div>
- 无内容
- </div>
-</template>
-<script>
- export default {
- components: {},
- props: [],
- data() {
- return {}
- },
- computed: {},
- watch: {},
- created() {
- },
- mounted() {
- },
- methods: {}
- }
-
-</script>
-<style>
- .el-rate {
- display: inline-block;
- vertical-align: text-top;
- }
-
-</style>