hzd/backstage-repair
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

合并后代码

Browse Source
This commit is contained in:
monanxiao
2024-10-12 11:26:29 +08:00
parent 017e64125d
commit 5289380ef5
7 changed files with 384 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/modules/index.js
+1 -1
View File
@@ -5,7 +5,7 @@ import service from "../request.js";
export function LoginInfo(query) {
return service({
method: "POST",
url: "/permission/LoginInfo",
url: "/login",
data: query,
});
}
src/api/request.js
+89 -28
View File
@@ -1,44 +1,105 @@
import axios from "axios";
import {
ElMessage
} from "element-plus";
import { ElMessage, ElMessageBox } from "element-plus";
import router from "../router/router";
const errorCode = {
401: "登录状态已过期,即将返回首页重新登录。",
403: "当前操作没有权限",
404: "访问资源不存在",
default: "系统未知错误，请反馈给管理员",
};
const url = "https://repair.cpolar.top"; // "https://hazard.cpolar.top";
const service = axios.create({
timeout: 5000,
baseURL: url,
timeout: 5000,
});
// Request interceptors
service.interceptors.request.use(
(config) => {
if (localStorage.getItem('token'))
config.headers.token = localStorage.getItem('token')
(config) => {
if (localStorage.getItem("token")) {
config.headers["Authorization"] =
"Bearer " + localStorage.getItem("token");
}
return config;
},
(error) => {
Promise.reject(error);
}
if (config.url === "/login") {
config.headers["Content-Type"] = "multipart/form-data";
} else {
config.headers["Content-Type"] = "application/json";
}
let params = config.params;
let newData = {};
for (let key in params) {
if (params[key] !== null && params[key] !== "") {
newData[key] = params[key];
}
}
config.params = newData;
return config;
},
(error) => {
Promise.reject(error);
}
);
// Response interceptors
service.interceptors.response.use(
(response) => {
if (response.status !== 200) {
ElMessage({
type: "error",
message: "服务器忙,请稍后再试~",
});
return;
(res) => {
// 对响应数据做点什么
const response = res.data;
const code = res.data.code || 200;
const message = errorCode[code] || res.data.msg || errorCode["default"];
if (code === 401) {
if (res.code === 401 || res.code === 4001) {
// 清除浏览器全部临时缓存
sessionStorage.clear();
localStorage.clear();
router.push("/login");
// store.commit('setMenuData', {});
// resetRouter(); // 重置路由
ElMessageBox.alert("你已被登出，请重新登录", "提示", {})
.then(() => {})
.catch(() => {});
}
} else if (code === 500) {
// Message({ message: msg, type: 'error' })
ElMessage.error(message);
return Promise.reject(new Error(msg));
} else if (code === 601) {
// Message({ message: msg, type: 'warning' })
ElMessage.error(message);
return Promise.reject("error");
} else if (code != 200) {
ElMessage.error(message);
return Promise.reject("error");
} else {
return response;
}
},
(error) => {
console.log(error.response.data); // 获取错误状态码
// 对响应错误做点什么
if (error.message.indexOf("timeout") != -1) {
ElMessage.error("网络超时");
} else if (error.message == "Network Error") {
ElMessage.error("网络连接错误");
} else if (error.response.data.code == "401") {
sessionStorage.clear();
localStorage.clear();
router.push("/login");
ElMessage.error(error.response.data.msg);
} else {
ElMessage.error(
error.response.data.msg ||
error.response.data.error ||
error.response.data.errMessage
);
}
return Promise.reject(error);
}
return response;
},
(error) => {
// do something
return Promise.reject(error);
}
);
export default service;
export default service;
src/layout/menu/index.vue
+2 -6
View File
@@ -33,7 +33,7 @@
<script setup>
import { computed, onMounted, reactive, ref } from "vue";
import { getMenuList } from "../../api/modules/index.js";
import { menuListItem } from "../../mock/permission";
import store from "../../store/index.js";
import menuItems from "./components/menuItems.vue";
// 引入本地路由表渲染导航栏
@@ -54,12 +54,8 @@ const themeConfig = store.getters.themeConfig;
// 菜单表存在后端的操作方式
onMounted(() => {
getMenuList().then((res) => {
menuList.value = res.data.data.menuList;
console.log(menuItems.value);
});
// 获取本地菜单表渲染
// menuList.value = menuTable;
menuList.value = menuListItem;
});
</script>
src/layout/menu/menuTable.js
+5
View File
@@ -10,6 +10,11 @@ const menuTable = [
url: "/home",
icon: "HomeFilled",
},
{
title: "服务项目",
url: "/goods",
icon: "HomeFilled",
},
{
title: "页面管理",
url: "/page",
src/mock/permission.js
+1 -1
View File
@@ -5,7 +5,7 @@ import {
} from "../views/home/options";
const Random = Mock.Random;
let menuList = [
export const menuListItem = [
{
title: "仪表盘",
url: "/home",
src/store/modules/users.js
+4 -4
View File
@@ -64,10 +64,10 @@ export default {
LoginInfo(userInfo)
.then((res) => {
console.log(res.data.data);
sessionStorage.setItem("token", res.data.data.token);
sessionStorage.setItem("UserInfo", JSON.stringify(res.data.data));
commit("setToken", res.data.data.token);
commit("setUserInfo", res.data.data);
sessionStorage.setItem("token", res.data.token);
sessionStorage.setItem("UserInfo", JSON.stringify(res.data));
commit("setToken", res.data.token);
commit("setUserInfo", res.data);
router.replace("/");
ElMessage({
message: "登录成功",
src/views/goods/index.vue
+282 -3
View File
@@ -1,10 +1,289 @@
<template>
<el-card>
<div>服务项目管理222</div>
<el-card shadow="never" class="henader-card">
<div class="flx-row">
<el-form :inline="true" :model="queryData" style="flex: 1">
<!-- <el-input placeholder="请输入搜索内容" v-model="queryData.keyWord">-->
<!-- </el-input>-->
</el-form>
<div class="flex-right">
<!-- <el-button type="primary" :icon="Search" @click="initData" class="ml20"-->
<!-- >搜索</el-button-->
<!-- >-->
<el-button type="primary" @click="dialogVisibleShow">+添加</el-button>
</div>
</div>
</el-card>
<el-card shadow="never">
<el-table
:data="tableData"
:header-cell-style="{ backgroundColor: '#ecf5ff' }"
border
stripe
style="width: 100%"
>
<el-table-column
v-for="item in options"
:key="item.type"
:prop="item.props"
:label="item.label"
:width="item.width"
:align="item.align"
show-overflow-tooltip
:fixed="item.fixed"
>
<template v-slot:default="scope" v-if="item.props === 'actions'">
<el-icon class="icon-view" @click="ItemView(scope.row)"
><View
/></el-icon>
<el-icon class="icon-edit" @click="editorClick(scope.row)"
><Edit
/></el-icon>
<el-popconfirm
confirm-button-text="确认"
cancel-button-text="取消"
:icon="InfoFilled"
icon-color="#626AEF"
title="确定要除该服务项目?"
@confirm="DeleteItem(index)"
>
<template #reference>
<el-icon class="icon-dele"><Delete /></el-icon>
</template>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
<el-pagination
small
background
:page-size="queryData.size"
layout="prev, pager, next"
:total="total"
class="mt-4"
@current-change="handleCurrentChange"
/>
</el-card>
<el-dialog
v-model="dialogVisible"
:title="`${dialogData.title}服务项目`"
:width="dialogWidth"
:hide-required-asterisk="dialogData.isView"
draggable
>
<el-form
:model="dialogData.FormData"
:rules="rules"
ref="FormRef"
class="demo-ruleForm"
>
<el-form-item
label="服务名称"
:label-width="formLabelWidth"
prop="goodsName"
>
<el-input v-model="dialogData.FormData.goodsName" autocomplete="off" />
</el-form-item>
<el-form-item label="服务价格" :label-width="formLabelWidth" prop="price">
<el-input v-model="dialogData.FormData.price" autocomplete="off" />
</el-form-item>
<el-form-item label="标题图片" :label-width="formLabelWidth" prop="carouselImage">
<el-input v-model="dialogData.FormData.carouselImage" type="textarea" />
</el-form-item>
<el-form-item label="服务说明" :label-width="formLabelWidth" prop="details">
<el-input v-model="dialogData.FormData.details" type="textarea" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="onSubmit()">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import {
Search,
Edit,
Delete,
UserFilled,
InfoFilled,
View,
} from '@element-plus/icons-vue'
import {
getGoodsList,
addGoods,
updateGoods,
} from '../../api/modules/goods.js'
import { options } from './options.js'
import { onMounted, reactive, ref } from 'vue'
import { ElMessage } from 'element-plus'
import { getDateTime } from '../../utils'
const queryData = ref({
keyWord: '',
page: 1,
size: 10,
})
const FormRef = ref()
const formLabelWidth = '140px'
const dialogData = reactive({
isView: true,
title: '添加',
FormData: {
id: 1,
goodsName: '',
price: '',
carouselImage: '',
details: '',
},
})
const dialogWidth = ref('0')
const rules = reactive({
goodsName: [{ required: true, message: '请填写服务项目姓名', trigger: 'change' }],
price: [{ required: true, message: '请填写价格', trigger: 'change' }],
carouselImage: [{ required: true, message: '请填写服务说明', trigger: 'change' }],
details: [{ required: true, message: '请填写说明信息', trigger: 'change' }],
})
const oldTableData = ref([])
const dialogVisible = ref(false)
const tableData = ref([])
const total = ref(0)
const initData = () => {
getGoodsList(queryData.value).then((res) => {
total.value = res.total
tableData.value = res.data
})
}
const dialogVisibleShow = () => {
dialogData.FormData = {
goodsName: '',
price: '',
carouselImage: '',
details: '',
}
dialogVisible.value = true
}
const onSubmit = () => {
FormRef.value.validate(async (valid) => {
if (!valid) return
try {
if (dialogData.FormData.id) {
updateGoods(dialogData.FormData).then((res) => {
console.log('编辑数据成功')
console.log(ElMessage)
ElMessage({
message: '编辑服务项目成功',
type: 'success',
})
// tableData.value = res.data
})
} else {
dialogData.FormData.date = getDateTime('')
addGoods(dialogData.FormData)
.then((res) => {
ElMessage({
message: '添加服务项目成功',
type: 'success',
})
dialogData.FormData.id = res.data.data.id
tableData.value.unshift(dialogData.FormData)
})
.catch((err) => {})
}
dialogVisible.value = false
} catch (error) {
console.log(error)
}
})
}
const handleCurrentChange = (val) => {
queryData.value.page = val
initData(queryData.value)
}
const editorClick = (item) => {
dialogVisible.value = true
dialogData.FormData = item
console.log(dialogData.FormData)
dialogData.isView = false
dialogData.title = '编辑'
}
const ItemView = (item) => {
dialogVisible.value = true
dialogData.FormData = item
dialogData.isView = false
dialogData.title = ''
}
const DeleteItem = (index) => {
console.log(index)
tableData.value.splice(index, 1)
}
const cancelEvent = () => {
console.log('cancel!')
}
const setDialogWidth = () => {
console.log(document.body.clientWidth)
var val = document.body.clientWidth
const def = 800 // 默认宽度
if (val < def) {
dialogWidth.value = '100%'
} else {
dialogWidth.value = def + 'px'
}
}
onMounted(() => {
setDialogWidth()
window.onresize = () => {
return (() => {
setDialogWidth()
})()
}
initData()
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.henader-card {
margin-bottom: 20px;
}
.icon-view {
font-size: 20px;
color: #673ab7;
margin: 0 10px;
}
.icon-edit {
font-size: 20px;
color: #2f60c2;
margin: 0 10px;
}
.icon-dele {
font-size: 20px;
color: #ff5722;
}
.mt-4 {
float: right;
text-align: right;
margin-top: 20px;
margin-bottom: 20px;
}
.el-button--text {
margin-right: 15px;
}
.el-select {
width: 300px;
}
.el-input {
width: 300px;
}
.dialog-footer button:first-child {
margin-right: 10px;
}
</style>