加入需求管理界面控件值储存功能。

This commit is contained in:
Kane Wang 2023-02-06 16:43:40 +08:00
parent 9b57dbb772
commit 8e72f3bccd
10 changed files with 291 additions and 71 deletions

View File

@ -2,7 +2,7 @@
* @Author: Kane
* @Date: 2023-01-04 11:05:44
* @LastEditors: Kane
* @LastEditTime: 2023-02-05 10:53:45
* @LastEditTime: 2023-02-06 09:26:48
* @FilePath: /IT/src/layout/Index.vue
* @Description:
*
@ -97,10 +97,9 @@ export default {
/* width: 175px; */
background-color: #2f4156;
overflow-x: hidden;
/* height: calc(100vh - 50px);
height: calc(100vh - 50px);
max-height: calc(100vh - 50px);
min-height: calc(100vh - 50px); */
height: 100%;
min-height: calc(100vh - 50px);
}
#layout-header {

View File

@ -2,14 +2,14 @@
* @Author: Kane
* @Date: 2023-01-04 11:30:33
* @LastEditors: Kane
* @LastEditTime: 2023-02-06 00:25:26
* @LastEditTime: 2023-02-06 09:28:16
* @FilePath: /IT/src/layout/components/Aside.vue
* @Description:
*
* Copyright (c) ${2022} by Kane, All Rights Reserved. 223142 2f4156
-->
<template>
<el-scrollbar class="wrapper" height="400px">
<el-scrollbar class="wrapper">
<el-menu id="side-bar" router :default-active="currentPath" background-color="#2f4156" text-color="#fff"
active-text-color="#ffd04b" :collapse="asideCollapse">
<template v-for="route in routes" :key="route.path">

View File

@ -0,0 +1,99 @@
<!--
* @Author: Kane
* @Date: 2023-01-04 11:39:04
* @LastEditors: Kane
* @LastEditTime: 2023-02-04 01:09:49
* @FilePath: \IT工具综合平台\src\layout\components\Header.vue
* @Description:
*
* Copyright (c) ${2022} by Kane, All Rights Reserved.
-->
<template>
<div class="app_banner no_select">
<span class="company_name">CPIC</span>
<div class="version_div">
<div>测试版</div>
<div>3.6.7 x64 Build 202208301257</div>
</div>
<div class="buttons_div">
<User style="width: 25px; height; 25px; margin-right: 8px; cursor:pointer;" />
<SwitchButton style="width: 25px; height; 25px; margin-right: 8px; cursor:pointer;" @click="logout" />
</div>
</div>
</template>
<script>
//import { ElMessage } from "element-plus";
import { Logout } from "../../utils/api/info/account";
export default {
name: "AppBanner",
data()
{
return {};
},
// created() {
// console.log("banner");
// },
mounted()
{
//console.log("banner");
},
methods: {
logout()
{
this.$confirm("是否退出系统?", "请确认", {
confirmButtonText: "是",
cancelButtonText: "否",
type: "warning",
}).then(() =>
{
Logout();
});
},
},
};
</script>
<style scoped>
.app_banner {
background-color: var(--banner-background-color);
color: #fff;
display: flex;
justify-content: left;
align-items: center;
padding: 0px 15px 0px 15px;
height: 100%;
position: relative;
}
.no_select {
-webkit-touch-callout: none;
-moz-user-select: none;
/*火狐*/
-webkit-user-select: none;
/*webkit浏览器*/
-ms-user-select: none;
/*IE10*/
-khtml-user-select: none;
/*早期浏览器*/
user-select: none;
}
.app_banner>*+* {
margin-left: 10px;
}
.company_name {
font-size: 2rem;
}
.version_div {
font-size: 0.5rem;
}
.buttons_div {
margin-left: auto;
padding-top: 5px;
/* border: 1px solid salmon; */
}
</style>

View File

@ -2,8 +2,8 @@
* @Author: Kane
* @Date: 2023-01-04 11:39:04
* @LastEditors: Kane
* @LastEditTime: 2023-02-04 01:09:49
* @FilePath: \IT工具综合平台\src\layout\components\Header.vue
* @LastEditTime: 2023-02-06 10:17:22
* @FilePath: /IT/src/layout/components/Header.vue
* @Description:
*
* Copyright (c) ${2022} by Kane, All Rights Reserved.
@ -23,26 +23,16 @@
</template>
<script>
//import { ElMessage } from "element-plus";
import { ElMessageBox } from "element-plus";
import { Logout } from "../../utils/api/info/account";
export default {
name: "AppBanner",
data()
setup(props, context)
{
return {};
},
// created() {
// console.log("banner");
// },
mounted()
{
//console.log("banner");
},
methods: {
logout()
const logout = () =>
{
this.$confirm("是否退出系统?", "请确认", {
ElMessageBox.confirm("是否退出系统?", "请确认", {
confirmButtonText: "是",
cancelButtonText: "否",
type: "warning",
@ -50,7 +40,9 @@ export default {
{
Logout();
});
},
};
return { logout, };
},
};
</script>

View File

@ -20,7 +20,7 @@
<script>
export default {
name: "LayoutMain"
name: "LayoutMain",
};
</script>

View File

@ -10,8 +10,11 @@
*/
const state = {
status: {},
status: {},//包含全部需求状态的数组
status_update_time: new Date(),
ui: {
selected_status: [], //已选择的需求状态
},
};
export default {

View File

@ -0,0 +1,73 @@
/*
* @Author: Kane
* @Date: 2023-02-06 14:12:11
* @LastEditors: Kane
* @LastEditTime: 2023-02-06 15:52:55
* @FilePath: /IT/src/utils/api/LocalStorage.js
* @Description: 初始化localStorage中保存的值
*
* Copyright (c) ${2022} by Kane, All Rights Reserved.
*/
//常量
const REQUIREMRNT_UI = "requirement_ui";
//需求管理模块
function loadRequirementUI()
{
// debugger;
let requirementUI = null;
try
{
requirementUI = JSON.parse(window.localStorage.getItem(REQUIREMRNT_UI));
}
catch (error)
{
console.log("转换requirement-ui失败", error);
requirementUI = {};
}
//如果之前不存在json转换结果也会是null
if (requirementUI === null)
{
requirementUI = {};
}
if (requirementUI.selected_status === undefined)
{
requirementUI.selected_status = [];
}
if (requirementUI.title === undefined)
{
requirementUI.title = "";
}
if (requirementUI.serial_no === undefined)
{
requirementUI.serial_no = "";
}
if (requirementUI.request_people === undefined)
{
requirementUI.request_people = "";
}
if (requirementUI.commit_start_date === undefined)
{
requirementUI.commit_start_date = new Date();
requirementUI.commit_start_date.setMonth(0);
requirementUI.commit_start_date.setDate(1);
}
if (requirementUI.commit_end_date === undefined)
{
requirementUI.commit_end_date = new Date();
}
return requirementUI;
}
export { loadRequirementUI };

View File

@ -2,7 +2,7 @@
* @Author: Kane
* @Date: 2022-12-22 17:18:10
* @LastEditors: Kane
* @LastEditTime: 2023-02-04 21:51:11
* @LastEditTime: 2023-02-06 09:19:32
* @FilePath: /IT/src/utils/api/request.js
* @Description: 配置axios拦截器
*
@ -72,7 +72,7 @@ service.interceptors.response.use(
confirmButtonText: "是",
cancelButtonText: "否",
type: "warning",
},
}
).then(() =>
{
router.replace("/login");

View File

@ -3,7 +3,7 @@
* @Author: Kane
* @Date: 2022-12-14 15:23:54
* @LastEditors: Kane
* @LastEditTime: 2023-02-04 16:55:12
* @LastEditTime: 2023-02-06 14:32:18
* @FilePath: /IT/src/views/account/Login.vue
* @Description:
*
@ -59,6 +59,7 @@ import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { Login } from "@/utils/api/info/account";
import { ElMessage } from "element-plus";
//import router from "../../router/index";
export default {
@ -77,8 +78,8 @@ export default {
const tab_menu = reactive(
[
{ type: "login", label: "登录" },
{ type: "regiester", label: "注册" },
{ type: "login", label: "登录", },
{ type: "regiester", label: "注册", },
]);
const ui = reactive(
@ -103,6 +104,23 @@ export default {
type: "error",
});
};
//tokenvuexlocalStorage
const saveUserInfo = (userInfo) =>
{
console.log("保存用户信息");
console.log("保存用户信息", store);
//vuex
store.commit("app/SET_USERINFO", userInfo);
//localStorage
const token = userInfo.token;
const userInfoJson = JSON.stringify(userInfo);
window.localStorage.setItem("token", token);
window.localStorage.setItem("user_info", userInfoJson);
};
/**
* 登录
*/
@ -180,22 +198,6 @@ export default {
});
};
//tokenvuexlocalStorage
const saveUserInfo = (userInfo) =>
{
console.log("保存用户信息");
console.log("保存用户信息", store);
//vuex
store.commit("app/SET_USERINFO", userInfo);
//localStorage
const token = userInfo.token;
const userInfoJson = JSON.stringify(userInfo);
window.localStorage.setItem("token", token);
window.localStorage.setItem("user_info", userInfoJson);
};
onBeforeMount(() =>
{
//

View File

@ -2,7 +2,7 @@
* @Author: Kane
* @Date: 2023-02-02 22:19:12
* @LastEditors: Kane
* @LastEditTime: 2023-02-06 08:33:42
* @LastEditTime: 2023-02-06 15:57:19
* @FilePath: /IT/src/views/requirement/RequirementManager.vue
* @Description:
*
@ -38,7 +38,8 @@
</el-col>
<el-col :span="4">
<!-- <el-input v-model="query_param.status"></el-input> -->
<el-select multiple collapse-tags collapse-tags-tooltip v-model.trim.lazy="query_param.status">
<el-select multiple collapse-tags collapse-tags-tooltip
v-model.trim.lazy="query_param.selected_status">
<el-option v-for="option in statusData" :value="option.status_name" lable="option.status_code"
:key="option.status_code + option.status_name"></el-option>
</el-select>
@ -161,13 +162,13 @@
<span>状态</span>
</el-col>
<el-col :span="6">
<el-input readonly v-model="query_param.status"></el-input>
<el-input readonly v-model="query_param.select_status"></el-input>
</el-col>
<el-col :span="2">
<span>当前处理人</span>
</el-col>
<el-col :span="6">
<el-input readonly v-model="query_param.status"></el-input>
<el-input readonly v-model="query_param.select_status"></el-input>
</el-col>
</el-row>
<el-row :gutter="10">
@ -175,19 +176,19 @@
<span>联系人</span>
</el-col>
<el-col :span="6">
<el-input readonly v-model="query_param.status"></el-input>
<el-input readonly v-model="query_param.select_status"></el-input>
</el-col>
<el-col :span="2">
<span>联系方式</span>
</el-col>
<el-col :span="6">
<el-input readonly v-model="query_param.status"></el-input>
<el-input readonly v-model="query_param.select_status"></el-input>
</el-col>
<el-col :span="2">
<span>提交日期</span>
</el-col>
<el-col :span="6">
<el-input readonly v-model="query_param.status"></el-input>
<el-input readonly v-model="query_param.select_status"></el-input>
</el-col>
</el-row>
</div>
@ -228,12 +229,13 @@
</template>
<script>
import { reactive, computed, onBeforeMount } from "vue";
import { reactive, computed, onBeforeMount, onBeforeUnmount } from "vue";
//import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
import { requirementTestData } from '@/test/data/TestData';
import { useRouter } from "vue-router";
import { useStore } from "vuex";
import { query_requirement_ui } from "@/utils/api/requirement/requirement";
import { loadRequirementUI } from "@/utils/api/LocalStorage.js";
export default {
name: "requirement-manager",
@ -250,20 +252,39 @@ export default {
dialogRequirementDetailLoadingVisible: true,
pageVisible: false,
activeTabName: "requirement-detail",
requirement_status: [
"未提交", "部门审核", "需求分析", "技术开发", "待发布", "已发布", "被退回",
],
});
const query_param = reactive(
{
title: "",
serial_no: "",
request_people: "",
commit_start_date: new Date(),
commit_end_date: new Date(),
status: "",
});
// const query_param = reactive(
// {
// title: "",
// serial_no: "",
// request_people: "",
// commit_start_date: new Date(),
// commit_end_date: new Date(),
// selected_status: "",
// });
const query_param = reactive(loadRequirementUI());
//
// let saved_ui = query_param;
// if (saved_ui === null || saved_ui === "{}")
// {
// saved_ui = {
// selected_status: [],
// };
// window.localStorage.setItem("requirement_ui", JSON.stringify(saved_ui));
// }
// else
// {
// saved_ui = JSON.parse(saved_ui);
// }
// const selected_status = saved_ui.selected_status;
// //
// const requirement_status = store.state.requirement.status;
/*计算变量 *****************/
const tableHeight = computed(() =>
{
return 10 * 50 + 40;
@ -318,7 +339,7 @@ export default {
const showRequirementDetail = (serial_no) =>
{
console.log("状态", query_param.status);
console.log("状态", query_param.select_status);
setTimeout(() =>
{
ui.dialogRequirementDetailLoadingVisible = false;
@ -335,15 +356,45 @@ export default {
ui.dialogRequirementDetailLoadingVisible = true;
};
//
const onUIChange = () =>
{
//console.log("", query_param.status);
// debugger;
//
window.localStorage.setItem("requirement_ui", JSON.stringify(query_param));
store.state.requirement.ui.selected_status = query_param.select_status;
};
onBeforeMount(() =>
{
query_param.commit_end_date = new Date(Date.now());
query_param.commit_start_date = new Date();
// debugger;
//selected_status
if (query_param.selected_status.length === 0)
{
for (let index in store.state.requirement.status)
{
const status_name = store.state.requirement.status[index].status_name;
query_param.commit_start_date.setMonth(query_param.commit_end_date.getMonth() - 1);
if (typeof status_name === "string" && status_name.length != 0)
{
query_param.selected_status.push(status_name);
}
}
onUIChange();
}
});
//
onBeforeUnmount(() =>
{
onUIChange();
});
/*加载数据***************************/
//
query_requirement_ui(store.state.requirement, "ErrorPage");
//
@ -366,6 +417,7 @@ export default {
onTablePageSizeChange,
showRequirementDetail,
closeRequirementDetail,
onUIChange,
//
onBeforeMount,
};