From 25fa992e12447e535b801da2cc497bdafe0b7b9b Mon Sep 17 00:00:00 2001
From: zhouwenxuan <1175765986@qq.com>
Date: 星期四, 30 十一月 2023 09:25:19 +0800
Subject: [PATCH] 后台管理页面、菜单配置
---
src/utils/request.js | 2
src/views/safetyReview/notice/notice.vue | 86 +++++++++++++----
src/api/backManage/notice.js | 34 ++++++
src/views/safetyReview/notice/components/noticeDialog.vue | 74 ++++++++++++--
src/layout/components/Sidebar/index.vue | 18 ++-
src/views/components/loginForm.vue | 16 ++
src/components/Editor/index.vue | 27 +++++
7 files changed, 208 insertions(+), 49 deletions(-)
diff --git a/src/api/backManage/notice.js b/src/api/backManage/notice.js
index 014c25e..cda746e 100644
--- a/src/api/backManage/notice.js
+++ b/src/api/backManage/notice.js
@@ -2,7 +2,39 @@
export function getNoticeList() {
return request({
- url: 'api/system/notice/noticeList',
+ url: '/system/notice/noticeList',
method: 'get'
})
}
+
+export function addNotice(data) {
+ return request({
+ url: '/system/notice/addNotice',
+ method: 'post',
+ data: data
+ })
+}
+
+export function getNoticeDetail(params) {
+ return request({
+ url: '/system/notice/getNoticeById',
+ method: 'get',
+ params: params
+ })
+}
+
+export function editNotice(params) {
+ return request({
+ url: `/system/notice/editNotice`,
+ method: 'put',
+ data: params
+ })
+}
+
+export function delNotice(data) {
+ return request({
+ url: `/system/notice/remove/` + data.id,
+ method: 'delete'
+ })
+}
+
diff --git a/src/components/Editor/index.vue b/src/components/Editor/index.vue
index bb8b869..42806c6 100644
--- a/src/components/Editor/index.vue
+++ b/src/components/Editor/index.vue
@@ -33,8 +33,30 @@
const { proxy } = getCurrentInstance();
+import{ Quill } from 'vue-quill-editor';
+// 自定义插入a链接
+var Link = Quill.import('formats/link');
+class FileBlot extends Link { // 继承Link Blot
+ static create(value) {
+ let node = undefined
+ if (value&&!value.href){ // 适应原本的Link Blot
+ node = super.create(value);
+ }
+ else{ // 自定义Link Blot
+ node = super.create(value.href);
+ // node.setAttribute('download', value.innerText); // 左键点击即下载
+ node.innerText = value.innerText;
+ node.download = value.innerText;
+ }
+ return node;
+ }
+}
+FileBlot.blotName = 'link';
+FileBlot.tagName = 'A';
+Quill.register(FileBlot);
+
const quillEditorRef = ref();
-const uploadUrl = ref(import.meta.env.VITE_APP_BASE_API + "/common/upload"); // 上传的图片服务器地址
+const uploadUrl = ref(import.meta.env.VITE_APP_BASE_API + "/system/common/uploadFile"); // 上传的图片服务器地址
const headers = ref({
Authorization: "Bearer " + getToken()
});
@@ -87,7 +109,7 @@
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
[{ align: [] }], // 对齐方式
["clean"], // 清除文本格式
- ["link", "image", "video"] // 链接、图片、视频
+ ["link", "image", "upload"] // 链接、图片、视频
],
},
placeholder: props.readOnly ? "" : "请输入内容",
@@ -156,6 +178,7 @@
// 获取光标位置
let length = quill.selection.savedRange.index;
// 插入图片，res.url为服务器返回的图片链接地址
+
quill.insertEmbed(length, "image", import.meta.env.VITE_APP_BASE_API + res.fileName);
// 调整光标到最后
quill.setSelection(length + 1);
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index e7245e5..a625286 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -39,16 +39,18 @@
const permissionStore = usePermissionStore()
// const sidebarRouters = computed(() => permissionStore.sidebarRouters);
const sidebarRouters = ref([])
+
onMounted(() => {
- getMenu();
+ sidebarRouters.value = JSON.parse(Cookies.get('routers'))
});
-const getMenu = () => {
- const userInfo = JSON.parse(Cookies.get('userInfo'))
- if(userInfo.identity === 0) {
- sidebarRouters.value = menu.adminMenu
- Cookies.set('routers',JSON.stringify(sidebarRouters.value))
- }
-}
+// const getMenu = () => {
+// const userInfo = JSON.parse(Cookies.get('userInfo'))
+// if(userInfo.identity === 0) {
+//
+// sidebarRouters.value = menu.adminMenu
+// Cookies.set('routers',JSON.stringify(sidebarRouters.value))
+// }
+// }
diff --git a/src/utils/request.js b/src/utils/request.js
index 39cb883..994fc5d 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -27,7 +27,7 @@
// 是否需要防止数据重复提交
const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
if (getToken() && !isToken) {
- config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
+ config.headers['Authorization'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
}
// get请求映射params参数
if (config.method === 'get' && config.params) {
diff --git a/src/views/components/loginForm.vue b/src/views/components/loginForm.vue
index 5409772..02bc9cc 100644
--- a/src/views/components/loginForm.vue
+++ b/src/views/components/loginForm.vue
@@ -73,6 +73,7 @@
import useUserStore from '@/store/modules/user'
import { Register } from "@/layout/components";
import { Base64 } from 'js-base64'
+import menu from "@/layout/components/Sidebar/menu";
const userStore = useUserStore()
const route = useRoute();
@@ -80,8 +81,8 @@
const { proxy } = getCurrentInstance();
const loginForm = ref({
- username: "",
- password: "",
+ username: "admin",
+ password: "admin@123",
code: "",
uuid: ""
});
@@ -113,6 +114,8 @@
redirect.value = newRoute.query && newRoute.query.redirect;
}, { immediate: true });
+
+const sidebarRouters = ref([])
function handleLogin() {
proxy.$refs.loginRef.validate(valid => {
if (valid) {
@@ -138,9 +141,14 @@
}
return acc;
}, {});
- const routers = JSON.parse(Cookies.get('routers'))
+ const userInfo = JSON.parse(Cookies.get('userInfo'))
+ if(userInfo.identity === 0) {
+ sidebarRouters.value = menu.adminMenu
+ Cookies.set('routers',JSON.stringify(sidebarRouters.value))
+ }
+ console.log("sidebarRouters.value",sidebarRouters.value)
router.push({
- path: routers[0].path
+ path: sidebarRouters.value[0].path
})
// router.push({ path: redirect.value || "/", query: otherQueryParams });
}).catch(() => {
diff --git a/src/views/safetyReview/notice/components/noticeDialog.vue b/src/views/safetyReview/notice/components/noticeDialog.vue
index 28ca3c6..27f66bd 100644
--- a/src/views/safetyReview/notice/components/noticeDialog.vue
+++ b/src/views/safetyReview/notice/components/noticeDialog.vue
@@ -33,7 +33,9 @@
</div>
</el-form-item>
<el-form-item v-if="!isReview" style="margin-left: -80px" prop="noticeContent">
+<!-- <tinymce v-model="state.noticeForm.noticeContent"></tinymce>-->
<editor ref="myQuillEditor" v-model="state.noticeForm.noticeContent" :height="300"></editor>
+
</el-form-item>
<el-form-item label="公告内容:" v-else>
<div class="ql-container ql-snow" style="height: 300px;width: 100%;margin-top: 10px;" >
@@ -56,6 +58,8 @@
import {reactive, ref, toRefs} from 'vue'
import Editor from "@/components/Editor/index.vue";
import {ElMessage} from "element-plus";
+import {addNotice, editNotice, getNoticeDetail} from "@/api/backManage/notice";
+const emit = defineEmits(["getList"]);
const dialogVisible = ref(false);
const title = ref("");
@@ -65,26 +69,39 @@
const isReview = ref(false);
const state = reactive({
noticeForm: {
+ id: '',
noticeTitle: '',
noticeContent: '',
fileList: []
},
formRules:{
noticeTitle: [{ required: true, message: '请填写公告标题', trigger: 'blur' }],
- noticeContent: [{ required: true, message: '请输入公告内容', trigger: 'change' }],
+ noticeContent: [{ required: true, message: '请输入公告内容', trigger: 'blur' }],
},
})
-const openDialog = (type, value) => {
+const openDialog = async (type, value) => {
isReview.value = false;
title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
- if(type === 'edit') {
- state.noticeForm = value;
+ if(type === 'edit' || type === 'review') {
+ const param = {
+ noticeId: value.id
+ }
+ const res = await getNoticeDetail(param);
+ if(res.code === 200){
+ state.noticeForm.id = res.data.id
+ state.noticeForm.noticeTitle = res.data.title
+ state.noticeForm.noticeContent = res.data.content
+ }else{
+ ElMessage.warning(res.message)
+ }
}
if(type === 'review') {
isReview.value = true;
- state.noticeForm = value;
+ }
+ if(type === 'add'){
+ reset()
}
dialogVisible.value = true;
}
@@ -99,22 +116,55 @@
});
return;
}
- console.log('file, fileList',state.noticeForm.noticeContent);
- noticeRef.value.clearValidate();
- reset();
- dialogVisible.value = false;
-
+ if(title.value === '新增'){
+ const param = {
+ content: state.noticeForm.noticeContent,
+ title: state.noticeForm.noticeTitle
+ }
+ const res = await addNotice(param)
+ if(res.code === 200){
+ ElMessage({
+ type: 'success',
+ message: '新增成功'
+ });
+ }else{
+ ElMessage.warning(res.message)
+ }
+ emit("getList")
+ reset();
+ noticeRef.value.clearValidate();
+ dialogVisible.value = false;
+ }else if(title.value === '编辑') {
+ const nowDate = new Date()
+ const param = {
+ id: state.noticeForm.id,
+ content: state.noticeForm.noticeContent,
+ title: state.noticeForm.noticeTitle
+ }
+ const res = await editNotice(param)
+ if(res.code === 200){
+ ElMessage({
+ type: 'success',
+ message: '编辑成功'
+ });
+ }else{
+ ElMessage.warning(res.message)
+ }
+ emit("getList")
+ reset();
+ noticeRef.value.clearValidate();
+ dialogVisible.value = false;
+ }
}
}
const handleClose = () => {
noticeRef.value.clearValidate();
- reset();
dialogVisible.value = false;
-
}
const reset = () => {
state.noticeForm = {
+ id: '',
noticeTitle: '',
noticeContent: ''
}
diff --git a/src/views/safetyReview/notice/notice.vue b/src/views/safetyReview/notice/notice.vue
index 0579b20..b313980 100644
--- a/src/views/safetyReview/notice/notice.vue
+++ b/src/views/safetyReview/notice/notice.vue
@@ -10,33 +10,38 @@
</div>
<!-- 表格数据 -->
<el-table v-loading="loading" :data="dataList" :border="true">
- <el-table-column label="发布时间" prop="publishTime" align="center" />
- <el-table-column label="标题" prop="noticeTitle" align="center" :show-overflow-tooltip="true" width="650" />
+ <el-table-column label="发布时间" prop="createTime" align="center" />
+ <el-table-column label="标题" prop="title" align="center" :show-overflow-tooltip="true" width="650" />
<el-table-column label="最近修改时间" prop="updateTime" align="center" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
<template #default="scope">
<el-button link type="primary" @click="openDialog('review',scope.row)" >查看</el-button>
- <el-button link type="primary" @click="openDialog('edit',scope.row)" v-hasPermi="['system:role:edit']">编辑</el-button>
- <el-button link type="danger" @click="handleDelete(scope.row)" v-hasPermi="['system:role:remove']">删除</el-button>
+ <el-button link type="primary" @click="openDialog('edit',scope.row)" >编辑</el-button>
+ <el-button link type="danger" @click="handleDelete(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"
- />
+ <div class="pag-container">
+ <el-pagination
+ v-model:current-page="data.queryParams.pageNum"
+ v-model:page-size="data.queryParams.pageSize"
+ :page-sizes="[10,15,20,25]"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="total"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
<notice-dialog ref="noticeRef" @getList = "getList"></notice-dialog>
</div>
</template>
<script setup>
-import {getCurrentInstance, reactive, ref, toRefs} from "vue";
+import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import noticeDialog from "./components/noticeDialog.vue"
-import {ElMessageBox} from "element-plus";
+import {ElMessage, ElMessageBox} from "element-plus";
+import {getNoticeList, delNotice} from "@/api/backManage/notice";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
@@ -44,23 +49,47 @@
queryParams: {
pageNum: 1,
pageSize: 10,
+ title: '',
+ content: '',
},
- total: 0,
- dataList: []
-
-
});
+const dataList = ref([]);
+const total = ref(0);
-const { queryParams, total, dataList } = toRefs(data);
+const { queryParams } = toRefs(data);
-const getList = () => {
+onMounted(() => {
+ getList();
+});
+const getList = async () => {
loading.value = true;
- console.log("获取数据")
+ const res = await getNoticeList(data.queryParams);
+ if(res.code === 200){
+ dataList.value = res.data.list.map(item => {
+ return {
+ ...item,
+ createTime: item.createTime.replace(/T/g," ")
+ }
+ })
+ total.value = res.data.total
+ }else{
+ ElMessage.warning(res.message)
+ }
loading.value = false;
+
}
const openDialog = (type, value) => {
noticeRef.value.openDialog(type, value);
+}
+
+const handleSizeChange = (val) => {
+ data.queryParams.pageSize = val
+ getList()
+}
+const handleCurrentChange = (val) => {
+ data.queryParams.pageNum = val
+ getList()
}
/** 重置新增的表单以及其他数据 */
@@ -77,8 +106,23 @@
type: 'warning',
})
.then( async() => {
-
+ const res = await delNotice(val);
+ if(res.code === 200){
+ ElMessage({
+ type: 'success',
+ message: '删除成功'
+ });
+ getList();
+ }else{
+ ElMessage.warning(res.message)
+ }
})
}
</script>
+<style lang="scss">
+.pag-container{
+ float: right;
+ margin-top: 10px;
+}
+</style>
--
Gitblit v1.9.2